
:root{--ink:#123e6a;--muted:#506b83;--gold:#ffe79c;--line:#d5e5ef}*{box-sizing:border-box}body{margin:0;font:16px/1.65 'Segoe UI',Arial,sans-serif;color:var(--ink);background:#2876b3;min-height:100vh}body:before{content:'';position:fixed;inset:0;z-index:-2;background:linear-gradient(90deg,#08326480,#0d416b08 75%),url('starlaro-world.webp') center/cover no-repeat}body:after{content:'';position:fixed;inset:0;z-index:-1;background:linear-gradient(0deg,#062856a6,transparent 70%)}a{color:inherit;text-decoration:none}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid var(--gold);outline-offset:6px}header{padding:24px 5vw;display:flex;align-items:center;justify-content:space-between;gap:24px;color:white;background:#07355c35;border-bottom:1px solid #ffffff30;backdrop-filter:blur(12px)}.brand{display:flex;align-items:center;gap:13px}.brand svg{width:43px;height:43px;filter:drop-shadow(0 3px 0 #16476c)}.brand strong{font-size:22px;letter-spacing:3px;display:block;line-height:1.2}.brand small{font-size:9px;letter-spacing:1.2px;display:block;margin-top:5px}nav{display:flex;gap:8px}nav a{font-size:14px;padding:10px 17px;border:1px solid transparent;border-radius:24px}nav a:hover{background:#ffffff20}nav a[aria-current=page]{background:white;color:var(--ink);box-shadow:0 3px 0 #09335835}main{width:min(1160px,90%);margin:auto;min-height:calc(100vh - 178px);display:flex;align-items:center;padding:45px 0}section{width:100%}section[hidden]{display:none!important}.home{color:white;max-width:690px;padding:45px 0}.tag{display:inline-block;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;padding:7px 14px;border:1px solid #ffffff70;border-radius:30px}.home h1{font-size:clamp(46px,6.2vw,86px);line-height:1.02;letter-spacing:-3px;margin:28px 0;text-shadow:0 4px 18px #103a6350}.home h1 span{color:var(--gold)}.home p{max-width:480px;font-size:18px;color:#f1f7fc;text-shadow:0 2px 6px #15375a}.actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:32px}.btn{padding:13px 24px;border:1px solid #ffffff80;border-radius:30px;font-size:14px;font-weight:650;background:#174f7c55;color:white;backdrop-filter:blur(8px)}.btn.primary{background:var(--gold);color:var(--ink);border-color:var(--gold);box-shadow:0 4px 0 #183c6555}.btn:hover{transform:translateY(-2px)}.home-note{margin-top:36px;font-size:11px;letter-spacing:1.6px;color:#dceeff}.panel{background:#f9fcffed;border:1px solid #ffffffcc;border-radius:22px;padding:48px;box-shadow:0 22px 75px #07305d40;backdrop-filter:blur(15px)}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#287c92;font-weight:700;margin:0 0 12px}h2{font-size:clamp(33px,4vw,52px);line-height:1.12;letter-spacing:-1.5px;margin:0 0 25px}h3{font-size:24px;line-height:1.2;margin:0 0 16px}.intro{font-size:21px;line-height:1.6}.about-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:50px}.copy p{color:var(--muted);margin:0 0 18px}.copy .intro{color:var(--ink)}.illustration{min-height:330px;border-radius:14px;background:url('starlaro-world.webp') 75% center/cover;display:flex;align-items:end;padding:24px}.illustration span{background:#ffffffed;border-radius:12px;padding:14px 18px;font-size:13px;box-shadow:0 8px 24px #15375a30}.cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}.card{background:white;border:1px solid var(--line);padding:30px;border-radius:15px}.card .symbol{font-size:30px;color:#298795;margin-bottom:20px}.card p{color:var(--muted);margin:0}.section-desc{color:var(--muted);max-width:650px}.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.contact-title p{color:var(--muted)}dl{margin:0}.row{border-bottom:1px solid var(--line);padding:16px 0;display:grid;grid-template-columns:100px 1fr;gap:18px}.row:first-child{padding-top:0}dt{font-size:12px;color:var(--muted)}dd{margin:0;font-size:15px;overflow-wrap:anywhere}address{font-style:normal}.sample{display:inline-block;font-size:10px;font-weight:650;border-radius:4px;padding:1px 6px;background:#fff0c3;color:#745b18;margin-left:8px}.notice{color:#667d90;font-size:12px;margin-top:22px}.footer{padding:20px 5vw;display:flex;justify-content:space-between;gap:20px;align-items:center;color:#e1edf9;font-size:11px;border-top:1px solid #ffffff25;background:#082d5340}.footer a{font-size:12px}.skip{position:absolute;left:15px;top:-80px;background:white;padding:10px;z-index:10}.skip:focus{top:10px}@media(max-width:800px){header{align-items:start;flex-direction:column;gap:18px;padding:20px 5vw}nav{width:100%;justify-content:space-between}nav a{padding:8px 12px;font-size:13px}.about-grid,.contact-grid{grid-template-columns:1fr;gap:25px}.panel{padding:30px}.illustration{min-height:220px}.home{padding:35px 0}main{min-height:calc(100vh - 225px)}.cards{gap:16px}.card{padding:24px}}@media(max-width:500px){body:before{background-position:60% center}body:after{background:#07376455}main{width:90%;padding:28px 0}.home h1{font-size:52px;letter-spacing:-2px}.home p{font-size:16px}.cards{grid-template-columns:1fr}.panel{padding:25px 22px;border-radius:16px}.row{grid-template-columns:1fr;gap:4px;padding:15px 0}.footer{flex-direction:column;align-items:start;gap:5px}.brand strong{font-size:20px}nav a{font-size:12px;padding:8px 10px}.home-note{font-size:10px;letter-spacing:1px}.intro{font-size:18px}.sample{margin-left:4px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.btn:hover{transform:none}}
/* Editorial illustrations and gentle image motion */
.media-frame{position:relative;overflow:hidden;isolation:isolate;background:#c7e4f3;box-shadow:0 7px 20px #15487512;transition:box-shadow .5s ease}
.media-frame img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .85s cubic-bezier(.2,.65,.25,1),filter .85s ease;transform:scale(1.001)}
.illustration{padding:0;min-height:430px;background:none;align-self:stretch}
.illustration img{position:absolute;inset:0;object-position:center}
.illustration span{position:relative;z-index:2;margin:24px;align-self:end;transition:transform .5s ease;pointer-events:none}
.card-media{aspect-ratio:16/9;border-radius:11px;margin:0 0 24px}
.card .symbol{width:43px;height:43px;margin-bottom:18px;background:#e8f5f8;padding:6px;border-radius:10px}
.symbol svg{width:100%;height:100%;display:block}
.media-frame:after{content:'';position:absolute;inset:0;background:linear-gradient(125deg,#ffffff00 30%,#ffffff35 50%,#ffffff00 70%);transform:translateX(-125%);transition:transform 1s ease;pointer-events:none;z-index:1}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.media-frame:hover img{transform:scale(1.06);filter:saturate(1.08)}.media-frame:hover{box-shadow:0 12px 30px #15487525}.media-frame:hover:after{transform:translateX(125%)}.illustration:hover span{transform:translateY(-4px)}}
@media(max-width:800px){.illustration{min-height:360px}.illustration img{object-position:center 45%}}
@media(prefers-reduced-motion:reduce){.media-frame,.media-frame img,.illustration span,.media-frame:after{transition:none}}
/* Navigation panel entrance */
@keyframes panelReveal{from{opacity:0;transform:translateY(32px) scale(.975)}to{opacity:1;transform:translateY(0) scale(1)}}
.panel.is-entering{animation:panelReveal 580ms cubic-bezier(.18,.75,.25,1) both;transform-origin:center bottom}
@media(prefers-reduced-motion:reduce){.panel.is-entering{animation:none}}
/* Home: staggered entrance and illustration depth */
body:before{transition:transform 1.5s cubic-bezier(.2,.6,.25,1);transform-origin:78% 45%}
body.home-art-hover:before{transform:scale(1.045) translateX(-.4%)}
@keyframes homeSlide{from{opacity:0;transform:translateX(-38px)}to{opacity:1;transform:translateX(0)}}
.home.is-entering>*{animation:homeSlide 760ms cubic-bezier(.16,.75,.25,1) both}
.home.is-entering .tag{animation-delay:40ms}.home.is-entering h1{animation-delay:130ms}.home.is-entering p{animation-delay:240ms}.home.is-entering .actions{animation-delay:340ms}.home.is-entering .home-note{animation-delay:440ms}
@media(prefers-reduced-motion:reduce){.home.is-entering>*{animation:none}body:before{transition:none}body.home-art-hover:before{transform:none}}

.brand .brand-logo{width:43px;height:43px;filter:drop-shadow(0 3px 0 #16476c)}
