/* Cocles — fresh coastal corporate direction */
:root{--light:#f5f1e9;--ink:#0b1f33;--muted:#667987;--accent:#13a89e;--gold:#d6ad67}
body{background:var(--light)}
.wrap{width:min(1200px,calc(100% - 96px))}
.skip-link{position:fixed;top:-80px;left:16px;padding:14px;background:white;z-index:100}.skip-link:focus{top:12px}
a:focus-visible,button:focus-visible{outline:3px solid var(--gold);outline-offset:6px}
section{scroll-margin-top:30px}.nav{height:105px}.nav-logo{width:108px;height:88px;object-fit:contain}.brand{line-height:0}.nav-links{color:#e8eee9;gap:36px}.nav-cta{border-color:#13a89e;border-radius:40px;background:#13a89e;color:#06262b}.nav-cta:hover{background:#37c2b8}
.hero{padding-top:105px;min-height:850px;background:radial-gradient(ellipse at 8% 63%,#19666b 0,transparent 48%),linear-gradient(125deg,#0b1f33 40%,#102d40);isolation:isolate}
.hero:after{content:'';position:absolute;width:480px;height:480px;border-radius:50%;background:#13a89e;opacity:.11;filter:blur(65px);right:-160px;top:-160px;z-index:-1}
.hero-grid{min-height:660px;grid-template-columns:43% 57%;gap:0}.hero-art{order:2;margin-left:30px}.hero-copy{order:1;padding:50px 0;grid-column:1;grid-row:1;width:143%;z-index:2}.hero-art{grid-column:2;grid-row:1;justify-self:end;width:77%;align-self:center;transform:translateY(30px)}
.hero-art img{filter:none;transform:none;width:100%;height:auto}.logo-halo{width:88%;border:1px solid #d6ad6755;box-shadow:0 0 0 35px #13a89e0a,0 0 0 95px #13a89e09}.art-label{position:absolute;bottom:0;font-size:9px;letter-spacing:.3em;color:#d6ad67}
.hero h1{font-size:clamp(50px,5.8vw,82px);line-height:1.06;max-width:710px;margin:30px 0}.hero h1 em{color:#4ed1be;font-family:Georgia,serif;display:block}.hero-copy>p{max-width:450px;color:#d3e1e4;font-size:17px}.eyebrow{color:#d6ad67;font-size:10px}.eyebrow-line{background:#d6ad67;width:32px}.hero-actions{gap:26px}.button{border-radius:40px;padding:18px 25px}.button-light{background:#d6ad67;color:#0b1f33}.button-light:hover{background:#e7bf7e}.text-link{border-bottom:1px solid #ffffff44;padding:12px 0}.hero-foot{color:#b2cfce;height:85px}.coastal-lines{position:absolute;inset:40% -20% -40% 20%;border:1px solid #54bfb92b;border-radius:50%;transform:rotate(-20deg);pointer-events:none;z-index:-1;box-shadow:0 22px 0 -21px #54bfb944,0 55px 0 -54px #54bfb944,0 95px 0 -94px #54bfb944}
.section{padding:115px 0}.about{background:#f5f1e9}.about-grid{grid-template-columns:1.05fr 1fr;gap:90px}.section-kicker{color:#087e78;font-size:10px;letter-spacing:.2em}.small-label{color:#667987;font-size:12px;margin-bottom:22px}.section h2{font-size:clamp(38px,4.2vw,61px);font-weight:500}.section h2 span{color:#0d9189}.about-copy{padding-top:38px}.about-copy p{line-height:1.85}.about-copy .lead{font-size:23px}.about:after{content:'';display:block;width:80px;height:3px;background:#d6ad67;margin:55px auto -45px}
.expertise{background:#e0eeea;position:relative}.section-head{margin-bottom:50px}.service-grid{gap:18px;grid-template-columns:repeat(2,1fr)}.service{background:#f9f8f2;border:1px solid #0b1f3310;border-radius:4px;min-height:285px;padding:30px 34px;position:relative;overflow:hidden}.service h3{font-size:25px;margin:25px 0 12px}.service p{max-width:380px;font-size:15px}.service-icon{color:#0c958b;font-size:34px}.service-rule{background:#d6ad67;width:55px;transform:none;margin-top:26px}.service:nth-child(2){background:#0b1f33;color:#f5f1e9}.service:nth-child(2) p{color:#bed0d5}.service:nth-child(3){background:#138c83;color:white}.service:nth-child(3) p{color:#e0f2eb}.service:nth-child(3) .service-top,.service:nth-child(3) .service-icon{color:#d9eee7}.service:hover{transform:translateY(-5px);box-shadow:0 16px 32px #0b1f3310}
.approach{background:#f5f1e9}.principles>div{padding:28px 0;border-color:#cbd4cf}.principles>div>span{background:#dcebe5;color:#087e78;flex-shrink:0;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;margin-top:0}.principles h3{font-size:20px}.contact{background:radial-gradient(ellipse at 100% 100%,#167a76,transparent 60%),#0b1f33;position:relative;overflow:hidden}.contact .section-kicker{color:#d6ad67}.contact h2 em{color:#54d1bc}.contact-inner>p{color:#d5e4e2}.contact-note{color:#c0d8d4}.footer{background:#061b28}.footer-brand{color:#d6ad67}.footer-brand small{color:#a7bdc5}.footer-links a:hover{color:#54d1bc}.reveal{animation:enter .8s both}@keyframes enter{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.hero h1{font-size:82px}}
@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.hero h1{font-size:58px}.hero-copy{width:145%}.hero-art{width:76%;margin-left:0}.hero-grid{min-height:650px}.about-grid,.approach-grid{gap:45px}.nav-links{gap:22px}.hero-actions{gap:20px}.hero-copy>p{max-width:360px}}
@media(max-width:680px){.wrap{width:calc(100% - 40px)}.nav{height:82px}.nav-logo{width:90px;height:76px}.nav-links{top:82px;gap:24px;background:#0b1f33}.hero{padding-top:82px;min-height:unset}.hero-grid{display:flex;padding-top:25px;padding-bottom:52px}.hero-copy{order:1;width:100%;padding:22px 0 0}.hero h1{font-size:clamp(43px,10.8vw,65px);max-width:100%;line-height:1.08}.hero-copy>p{max-width:100%;font-size:16px}.hero-art{order:2;width:240px;max-height:none;margin:40px auto 10px;transform:none;align-self:center}.art-label{bottom:-8px;font-size:8px}.logo-halo{box-shadow:0 0 0 24px #13a89e0a}.hero-foot{font-size:7px;height:70px;letter-spacing:.1em}.hero-foot>span:first-child{max-width:160px;line-height:1.8}.eyebrow{font-size:8px;letter-spacing:.15em}.hero-actions{gap:18px}.button{font-size:12px;padding:17px 20px}.section{padding:78px 0}.about-grid,.approach-grid{gap:22px}.about-copy{padding-top:0}.section-kicker{margin-bottom:24px}.section h2{font-size:39px}.small-label{font-size:11px}.service-grid{grid-template-columns:1fr;gap:14px}.service{min-height:260px;padding:26px}.service h3{font-size:24px}.contact h2{font-size:61px}.footer-brand{font-size:15px}.footer{padding:40px 0}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

.nav-logo{background:#f5f1e9;border-radius:4px;width:112px;height:76px}

/* Interaction layer: all motion is optional; content works without hover. */
.service-icon{display:grid;place-items:center;width:60px;height:60px;border-radius:16px;background:#13a89e12;transition:transform .3s,background .3s,color .3s}.service-icon svg{width:36px;height:36px}.service:nth-child(2) .service-icon,.service:nth-child(3) .service-icon{background:#ffffff12}.service:hover .service-icon{transform:translateY(-3px) rotate(-6deg);background:#13a89e;color:#fff}.service:nth-child(3):hover .service-icon{background:#d6ad67;color:#0b1f33}.service-rule{transition:width .3s}.service:hover .service-rule{width:100px}
.button>span,.nav-cta>span,.text-link>span{display:inline-block;transition:transform .25s}.button:hover>span,.button:focus-visible>span,.nav-cta:hover>span{transform:translate(3px,-3px)}.text-link:hover>span{transform:translateY(4px)}
.journey{min-width:0}.journey-tabs{display:flex;border-bottom:1px solid #bbcfc7;gap:6px;margin-bottom:28px}.journey-tabs button{flex:1;cursor:pointer;border:0;border-bottom:3px solid transparent;background:transparent;color:#526774;text-align:left;padding:15px 8px 18px;font-weight:600;font-size:15px;transition:color .2s,border-color .2s}.journey-tabs button span{display:block;font-size:11px;color:#087e78;margin-bottom:12px;letter-spacing:.1em}.journey-tabs button[aria-selected=true]{color:#087e78;border-color:#13a89e}.journey-panel{padding:28px;background:#e3ece5;border-radius:6px;min-height:300px}.journey-panel[hidden]{display:none}.journey-panel h3{font-size:27px;letter-spacing:-.035em;line-height:1.2;margin:18px 0}.journey-panel p{font-size:16px;line-height:1.8;color:#526774}.panel-kicker{font-size:10px;letter-spacing:.18em;color:#087e78;font-weight:700}.journey-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.journey-tags span{font-size:11px;padding:7px 10px;border:1px solid #afc9bb;border-radius:20px;color:#30584d}
@media(max-width:680px){.journey-panel{padding:23px;min-height:335px}.journey-tabs button{font-size:14px}.service-icon{width:54px;height:54px}}
@media(prefers-reduced-motion:reduce){.service:hover .service-icon,.button:hover>span,.button:focus-visible>span,.nav-cta:hover>span,.text-link:hover>span{transform:none}}