:root{--rd:#1273D4;--rd2:#0B2A6B;--pk:#EEF7FE;--pk2:#D3EAFB;--yl:#38BDF8;--yl2:#E0F4FF;--ink:#12233F;--mut:#4F6484;--line:#CFE3F5;--wa:#0F7A43;--r:20px;--sh:0 12px 32px rgba(18,115,212,.14)}
*{box-sizing:border-box}img,svg,video{max-width:100%}body{overflow-x:hidden;-webkit-text-size-adjust:100%}h1,h2,h3,p,a,li,summary{overflow-wrap:anywhere}html{scroll-behavior:smooth;scroll-padding-top:80px}
body{margin:0;font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:#fff;line-height:1.7;padding-bottom:84px}
h1,h2,h3{font-family:Newsreader,Georgia,serif;font-weight:600;line-height:1.15;letter-spacing:-.01em;margin:0 0 .5em;color:var(--rd2)}
h1{font-size:clamp(2.4rem,6.4vw,4.2rem)}h2{font-size:clamp(1.9rem,4vw,2.7rem)}h3{font-size:1.3rem}
h2::after{content:"";display:block;width:56px;height:5px;border-radius:5px;background:var(--yl);margin-top:12px}
a{color:inherit}.wrap{max-width:1140px;margin:0 auto;padding:0 22px}.narrow{max-width:780px}
.skip{position:absolute;left:-999px}.skip:focus{left:10px;top:10px;background:#fff;padding:8px;z-index:99}
.ico{width:26px;height:26px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 26px;border-radius:999px;font-weight:800;text-decoration:none;border:2px solid transparent;transition:transform .2s,box-shadow .2s;min-height:48px;text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sh)}
.btn:focus-visible,summary:focus-visible,.burger:focus-visible,a:focus-visible{outline:3px solid var(--rd);outline-offset:3px}
.btn.wa{background:var(--wa);color:#fff}
.btn.ghost,.btn.call{background:#fff;border-color:var(--rd);color:var(--rd2)}
.btn.lg{padding:15px 32px;font-size:1.05rem}.btn.sm{padding:9px 18px;font-size:.9rem;min-height:40px}
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.95);backdrop-filter:blur(10px);border-bottom:3px solid var(--yl)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;min-height:72px}
.logo{text-decoration:none;display:flex;align-items:center;gap:10px;line-height:1.1}.logo img{width:48px;height:48px;display:block}.logo-t{display:flex;flex-direction:column}
.logo b{font-family:Newsreader,serif;font-weight:600;font-size:1.55rem;color:var(--rd)}.logo small{font-size:.78rem;letter-spacing:.06em;color:var(--mut);font-weight:700}
.nav{display:flex;align-items:center;gap:22px}.nav a{text-decoration:none;font-weight:700;font-size:.93rem}.nav a:not(.btn):hover{color:var(--rd)}.nav .btn{color:#fff}
.burger{display:none;background:#fff;border:1.5px solid var(--pk2);border-radius:12px;width:46px;height:46px;padding:0;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger span{width:22px;height:2px;background:var(--rd)}
.hero{background:linear-gradient(135deg,var(--pk) 0%,var(--pk2) 55%,var(--yl2) 100%);padding:80px 0 88px}
.hero-in{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:center}
.lead{font-size:1.15rem;color:var(--mut);max-width:56ch}.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.hero-art img,.hero-art svg{object-fit:cover;width:100%;height:auto;display:block;border-radius:24px;box-shadow:0 0 0 8px #fff,0 0 0 11px var(--yl),var(--sh)}
.sub-hero .hero-in{grid-template-columns:1.25fr .75fr}.sub-hero{padding:56px 0 64px}.crumb{font-size:.88rem;color:var(--mut);margin:0 0 18px}.crumb a{text-decoration:none;font-weight:700;color:var(--rd)}
.sec{padding:84px 0}.alt{background:var(--pk)}.sub{color:var(--mut);max-width:62ch;margin:0 0 40px}
.mini{margin:32px 0 14px;font-size:1.1rem}
.grid{display:grid;gap:22px}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;align-items:flex-start;gap:4px;text-decoration:none;box-shadow:var(--sh)}
.card p{margin:0 0 16px;color:var(--mut)}.card .btn{margin-top:auto}.card.flat{box-shadow:none}
.ic{width:52px;height:52px;border-radius:50%;background:var(--pk2);color:var(--rd);display:grid;place-items:center;margin-bottom:10px}
.card:nth-child(even) .ic{background:var(--yl2);color:#0B2A6B}
.area:hover{border-color:var(--rd)}.area span{margin-top:auto;font-weight:800;font-size:.9rem;color:var(--rd)}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:10px;padding:0;margin:0}
.chips li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:9px 18px;font-weight:700}.chips a{text-decoration:none}.chips a:hover{color:var(--rd)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.gal figure{margin:0;position:relative;overflow:hidden;border-radius:var(--r);box-shadow:var(--sh);background:var(--pk2)}.gal .wide{grid-column:span 2}.gal img{width:100%;height:260px;object-fit:cover;display:block}.gal figcaption{position:absolute;left:12px;bottom:12px;background:rgba(255,255,255,.94);color:var(--rd2);font-weight:800;font-size:.85rem;padding:5px 12px;border-radius:999px}
.flogo{display:inline-block;background:#fff;border-radius:50%;padding:4px;margin-bottom:12px;line-height:0}.flogo img{width:56px;height:56px}
.note{color:var(--mut);margin-top:24px}
.faq{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:12px;padding:0 22px}
.faq summary{cursor:pointer;font-weight:800;padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:12px;color:var(--rd2)}
.faq summary::after{content:"+";color:var(--rd);font-size:1.5rem;line-height:1}.faq[open] summary::after{content:"–"}
.faq summary::-webkit-details-marker{display:none}.faq p{margin:0 0 18px;color:var(--mut)}
.ftr{background:var(--rd2);color:#DCEBFA;padding:60px 0 24px;border-top:5px solid var(--yl)}.ftr-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:32px}
.ftr h3{font-size:1.15rem;color:#fff}.ftr p{margin:.2em 0}.ftr ul{list-style:none;padding:0;margin:0}.ftr li{margin:.35em 0}.ftr a{text-decoration:none}.ftr a:hover{color:var(--yl)}
.copy{text-align:center;color:#A9C6EA;font-size:.88rem;margin:40px 20px 0;border-top:1px solid #2F5AA0;padding-top:20px}
.fab{position:fixed;right:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:60;display:flex;gap:10px}.fab .btn{box-shadow:var(--sh)}
@media(max-width:860px){
 .burger{display:flex}.nav{position:absolute;top:100%;left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 22px 20px;border-bottom:3px solid var(--yl);display:none}
 .nav.open{display:flex}.nav a:not(.btn){padding:12px 4px;border-bottom:1px solid var(--line)}
 .hero-in,.g3,.g2,.ftr-grid,.sub-hero .hero-in{grid-template-columns:1fr}.gal{grid-template-columns:1fr}.gal .wide{grid-column:auto}.gal img{height:220px}.hero{padding:48px 0 56px}.hero-art{order:-1}.sec{padding:56px 0}
 .cta .btn{width:100%}.fab{left:12px;right:12px;bottom:12px}.fab .wa{flex:1;min-height:54px}.fab .call{min-height:54px}
}
/* === Tablet === */
@media(max-width:1024px){
 .g3{grid-template-columns:repeat(2,1fr)}.ftr-grid{grid-template-columns:1fr 1fr}.ftr-grid>div:first-child{grid-column:1/-1}
 .gal{grid-template-columns:repeat(2,1fr)}.gal .wide{grid-column:span 2}.hero-in{gap:32px}.nav{gap:14px}
}
/* === Mobil === */
@media(max-width:860px){
 .g3,.g2,.ftr-grid,.gal{grid-template-columns:1fr}.ftr-grid>div:first-child{grid-column:auto}.gal .wide{grid-column:auto}
 .nav{max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);overflow-y:auto}
 .hero-in{gap:28px}.lead{font-size:1.05rem}.card{padding:22px}.sub{margin-bottom:28px}
 .hero-art img,.hero-art svg{box-shadow:0 0 0 5px #fff,0 0 0 8px var(--yl),var(--sh)}
 .fab{padding-bottom:env(safe-area-inset-bottom)}
}
@media(max-width:480px){
 .wrap{padding:0 16px}h1{font-size:2.05rem}h2{font-size:1.65rem}h3{font-size:1.15rem}
 .logo b{font-size:1.3rem}.logo small{font-size:.7rem}.logo img{width:40px;height:40px}.hdr-in{min-height:64px}
 .sec{padding:44px 0}.hero{padding:32px 0 44px}.sub-hero{padding:32px 0 44px}
 .chips{gap:8px}.chips li{padding:8px 14px;font-size:.92rem}
 .faq{padding:0 16px}.faq summary{padding:15px 0;font-size:.98rem}
 .fab .btn{padding:10px 14px;font-size:.95rem}.gal img{height:200px}
}
@media(max-width:360px){.logo small{display:none}.fab .call{padding:10px 12px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

.prose p{max-width:68ch;margin:0 0 1em}.prose a{color:var(--rd);text-decoration:underline;text-underline-offset:2px}
