/* ARMONIA — shared hub stylesheet (guide + sub-pages) */
:root{
  --moss:#6A6E43;--citrino:#E9ECA0;--monte:#34381F;--sand:#E7DDC6;--bruma:#F6F4EA;--ink:#15160E;--clay:#C57B54;
  --maxw:1180px;--gap:clamp(22px,5vw,72px);--ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bruma);color:var(--ink);font-family:'Jost',-apple-system,system-ui,sans-serif;font-weight:300;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
.frau{font-family:'Fraunces',Georgia,serif;font-variation-settings:'SOFT' 28,'WONK' 1}
.eyebrow{font-family:'Jost',sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.4em;font-size:.72rem;color:var(--moss)}
.section-title{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 30,'WONK' 1;font-weight:340;font-size:clamp(2.1rem,5.2vw,3.7rem);line-height:1.03;letter-spacing:-.012em;margin:.34em 0 .25em;color:var(--monte)}
.lede{font-size:clamp(1.04rem,1.7vw,1.3rem);max-width:46ch;color:var(--monte);opacity:.92;font-weight:300}
.body{font-size:1.02rem;line-height:1.85;max-width:64ch;color:var(--ink);opacity:.9}
.body.center{margin-inline:auto;text-align:center}
section{padding:clamp(64px,9vw,128px) var(--gap);position:relative;z-index:2;scroll-margin-top:78px}
.wrap{max-width:var(--maxw);margin:0 auto;width:100%}
.wordmark{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 40,'WONK' 1;font-weight:380;line-height:.80;text-align:center;letter-spacing:.005em;display:inline-block}
.wordmark span{display:block}
.wmsub{font-family:'Jost';font-weight:300;text-transform:uppercase;text-align:center;letter-spacing:.5em;margin-top:.85em;text-indent:.5em;font-size:.7rem}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.6em;cursor:pointer;border:1px solid transparent;border-radius:100px;padding:.92em 1.7em;font-family:'Jost';font-weight:400;font-size:.84rem;letter-spacing:.14em;text-transform:uppercase;transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease)}
.btn:hover{transform:translateY(-2px)}
.btn--cit{background:var(--citrino);color:var(--monte)}.btn--cit:hover{background:#f1f4b8}
.btn--moss{background:var(--moss);color:var(--bruma)}.btn--moss:hover{background:#777c4c}
.btn--ghost{border-color:rgba(246,244,234,.55);color:var(--bruma)}.btn--ghost:hover{background:rgba(246,244,234,.12)}
.btn--ghost-dark{border-color:rgba(52,56,31,.4);color:var(--monte)}.btn--ghost-dark:hover{background:rgba(52,56,31,.07)}

/* nav */
header.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:18px clamp(20px,5vw,52px);transition:background .4s var(--ease),padding .4s var(--ease),box-shadow .4s var(--ease)}
header.nav.scrolled{background:rgba(52,56,31,.94);backdrop-filter:blur(10px);padding:11px clamp(20px,5vw,52px);box-shadow:0 1px 0 rgba(233,236,160,.14)}
.brandlock{display:flex;align-items:center;gap:11px;color:var(--bruma)}
.brandlock .wm{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 40,'WONK' 1;font-weight:380;font-size:.95rem;line-height:.82;letter-spacing:.06em}
.navlinks{display:flex;align-items:center;gap:26px}
.navlinks a{color:var(--bruma);font-size:.82rem;letter-spacing:.13em;text-transform:uppercase;opacity:.85;position:relative;padding:4px 0}
.navlinks a::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--citrino);transition:width .3s var(--ease)}
.navlinks a:hover{opacity:1}.navlinks a:hover::after{width:100%}
.navlinks .btn{padding:.62em 1.25em}
.navlinks a.btn--cit{color:var(--monte)}.navlinks a.btn--cit::after{display:none}
.navtoggle{display:none;background:none;border:0;cursor:pointer;flex-direction:column;gap:5px;padding:8px}
.navtoggle span{display:block;width:24px;height:2px;background:var(--bruma);transition:.3s var(--ease)}
@media(max-width:960px){
  .navlinks{position:fixed;inset:0 0 0 auto;width:min(78vw,320px);background:var(--monte);flex-direction:column;justify-content:center;align-items:flex-start;gap:24px;padding:40px;transform:translateX(100%);transition:transform .45s var(--ease);box-shadow:-20px 0 60px rgba(0,0,0,.4)}
  .navlinks.open{transform:translateX(0)}.navlinks a{font-size:1.05rem}
  .navtoggle{display:flex;z-index:60}
  .navtoggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .navtoggle.open span:nth-child(2){opacity:0}
  .navtoggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* hero (photo) */
.ghero{min-height:78vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--bruma);position:relative;overflow:hidden;padding:120px 20px 70px}
.ghero .bg{position:absolute;inset:-6% 0;z-index:0}
.ghero .bg img{width:100%;height:100%;object-fit:cover}
.ghero::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(70% 60% at 50% 42%,rgba(21,22,14,.42),transparent 72%),linear-gradient(180deg,rgba(21,22,14,.55),rgba(52,56,31,.7))}
.ghero .inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.ghero .eyebrow{color:var(--citrino);margin-bottom:22px}
.ghero h1{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 30,'WONK' 1;font-weight:340;font-size:clamp(2.6rem,7vw,5.2rem);line-height:1.02;letter-spacing:-.015em;max-width:16ch}
.ghero .sub{margin-top:20px;max-width:46ch;font-size:clamp(1rem,1.6vw,1.18rem);opacity:.92}

/* color hero (no-photo, for beach pages) */
.chero{min-height:62vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:var(--bruma);position:relative;overflow:hidden;padding:128px 20px 64px}
.chero .inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.chero .eyebrow{color:var(--citrino);margin-bottom:18px}
.chero h1{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 30,'WONK' 1;font-weight:340;font-size:clamp(2.6rem,7vw,5rem);line-height:1.02;letter-spacing:-.015em;max-width:18ch}
.chero .sub{margin-top:18px;max-width:48ch;font-size:clamp(1rem,1.6vw,1.16rem);opacity:.94}
.chero .mark{margin-bottom:24px}
.h-moss{background:radial-gradient(120% 100% at 50% 20%,#797d52,#4f5333)}
.h-monte{background:radial-gradient(120% 100% at 50% 20%,#414627,#21240f)}
.h-clay{background:radial-gradient(120% 100% at 50% 20%,#cf8a64,#a35f3c)}
.h-sand{background:radial-gradient(120% 100% at 50% 20%,#cbbf9f,#a99e7d)}
.h-sand .eyebrow,.h-sand h1,.h-sand .sub{color:var(--monte)}.h-sand .mark path{stroke:var(--monte)!important}

/* breadcrumb */
.crumb{background:var(--bruma);padding:22px var(--gap) 0}
.crumb .wrap{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--moss);opacity:.85}
.crumb a:hover{color:var(--monte)}

/* prose */
.prose{background:var(--bruma)}
.prose .wrap{max-width:760px}
.prose h2{font-family:'Fraunces',serif;font-variation-settings:'SOFT' 30,'WONK' 1;font-weight:360;font-size:clamp(1.6rem,3.4vw,2.3rem);color:var(--monte);margin:1.6em 0 .5em;line-height:1.15}
.prose h2:first-child{margin-top:0}
.prose h3{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.25rem;color:var(--moss);margin:1.4em 0 .3em}
.prose p{font-size:1.05rem;line-height:1.9;color:var(--ink);opacity:.9;margin:.6em 0}
.prose p.lead{font-size:clamp(1.15rem,2vw,1.4rem);font-family:'Fraunces',serif;font-variation-settings:'SOFT' 30;font-weight:340;color:var(--monte);opacity:1;line-height:1.5;margin-bottom:1.2em}
.prose ul{margin:.6em 0 1em 0;list-style:none}
.prose li{position:relative;padding:9px 0 9px 26px;font-size:1.02rem;line-height:1.7;border-bottom:1px solid rgba(52,56,31,.1)}
.prose li::before{content:"";position:absolute;left:0;top:18px;width:9px;height:9px;border-radius:50%;background:var(--moss)}
.prose li b{font-weight:500;color:var(--monte)}
.prose .note{margin:24px 0;padding:18px 22px;border-radius:8px;background:rgba(106,110,67,.1);border:1px solid rgba(106,110,67,.28);font-size:.96rem;color:var(--monte)}
.prose .note b{font-weight:500}

/* fact box */
.factbox{background:var(--sand)}
.factgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(52,56,31,.14);border:1px solid rgba(52,56,31,.14);border-radius:10px;overflow:hidden}
.factgrid>div{background:var(--sand);padding:24px 20px}
.factgrid .k{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}
.factgrid .v{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.3rem;color:var(--monte);margin-top:6px;line-height:1.2}
@media(max-width:760px){.factgrid{grid-template-columns:1fr 1fr}}

/* beaches grid (used on guide) */
.beaches{background:var(--monte);color:var(--bruma)}
.beaches .eyebrow{color:var(--citrino)}.beaches .section-title{color:var(--bruma)}
.beaches .head .body{color:var(--bruma);opacity:.84}
.bgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}
@media(max-width:900px){.bgrid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.bgrid{grid-template-columns:1fr}}
.bcard{border-radius:7px;overflow:hidden;display:flex;flex-direction:column;border:1px solid rgba(233,236,160,.2);background:rgba(233,236,160,.03);transition:transform .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease)}
.bcard:hover{transform:translateY(-5px);border-color:rgba(233,236,160,.5);box-shadow:0 24px 50px rgba(0,0,0,.3)}
.bcard .top{aspect-ratio:5/3;display:flex;align-items:center;justify-content:center}
.bcard .top svg{width:54px;height:54px}
.m-moss{background:radial-gradient(120% 120% at 30% 20%,#797d52,#585c37)}
.m-monte{background:radial-gradient(120% 120% at 30% 20%,#414627,#262915)}
.m-clay{background:radial-gradient(120% 120% at 30% 20%,#cf8a64,#ad6843)}
.m-sand{background:radial-gradient(120% 120% at 30% 20%,#ece3cf,#d8cbac)}
.bcard .bd{padding:22px 22px 24px;display:flex;flex-direction:column;flex:1}
.bcard h3{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.4rem;color:var(--citrino)}
.bcard p{font-size:.92rem;line-height:1.6;margin-top:9px;color:var(--bruma);opacity:.85}
.bcard .bf{margin-top:auto;padding-top:14px;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--citrino);opacity:.82;display:flex;justify-content:space-between;align-items:center;gap:8px}
.bcard .go{opacity:0;transform:translateX(-4px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.bcard:hover .go{opacity:1;transform:none}

/* feature */
.feature{overflow:hidden}
.feature .grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);align-items:center}
.feature.flip .grid{direction:rtl}.feature.flip .grid>*{direction:ltr}
.feature .photo{position:relative;border-radius:5px;overflow:hidden;aspect-ratio:5/4;box-shadow:0 30px 64px rgba(21,22,14,.22)}
.feature .photo img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.feature .photo:hover img{transform:scale(1.05)}
.feature .copy .body{margin-top:14px}
.feature.sand{background:var(--sand)}.feature.sand .section-title,.feature.sand .lede,.feature.sand .body{color:var(--monte)}
.feature.dark{background:var(--monte);color:var(--bruma)}
.feature.dark .section-title,.feature.dark .lede{color:var(--bruma)}.feature.dark .eyebrow{color:var(--citrino)}.feature.dark .body{color:var(--bruma);opacity:.86}
@media(max-width:880px){.feature .grid,.feature.flip .grid{grid-template-columns:1fr;direction:ltr}.feature .photo{aspect-ratio:4/3;order:-1}}

/* do grid */
.do{background:var(--bruma)}
.dogrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:52px}
@media(max-width:900px){.dogrid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.dogrid{grid-template-columns:1fr}}
.docard{border:1px solid rgba(52,56,31,.16);border-radius:7px;padding:26px 22px;background:#fff;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.docard:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(52,56,31,.14)}
.docard svg{width:34px;height:34px;color:var(--moss);margin-bottom:14px}
.docard h4{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.22rem;color:var(--monte)}
.docard p{font-size:.9rem;line-height:1.55;margin-top:6px;color:var(--ink);opacity:.82}

/* timeline */
.day{background:var(--monte);color:var(--bruma);overflow:hidden}
.day .eyebrow{color:var(--citrino)}.day .section-title{color:var(--bruma)}
.day .head{text-align:center;max-width:42ch;margin:0 auto}
.day .head .body{color:var(--bruma);opacity:.84;margin-inline:auto}
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-top:54px;border-top:1px solid rgba(233,236,160,.25)}
.slot{border-left:1px solid rgba(233,236,160,.2);padding:26px 20px 0}
.slot:nth-child(3n+1){border-left:none;padding-left:0}
.slot .tm{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-size:1.55rem;font-weight:360;color:var(--citrino)}
.slot .ti{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;opacity:.62;margin:6px 0 10px}
.slot .tx{font-size:.9rem;line-height:1.6;opacity:.88}
@media(max-width:760px){.timeline{grid-template-columns:1fr;border-top:none}.slot{border-left:none;border-top:1px solid rgba(233,236,160,.2);padding:22px 0}}

/* getting here */
.getting{background:var(--sand);color:var(--monte)}
.getting .cols{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);margin-top:34px}
@media(max-width:760px){.getting .cols{grid-template-columns:1fr;gap:30px}}
.getting h4{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.3rem;color:var(--monte);margin-bottom:8px}
.getting p{font-size:.98rem;line-height:1.8;color:var(--monte);opacity:.9;max-width:52ch}
.tip{margin-top:18px;padding:16px 20px;border-radius:8px;background:rgba(106,110,67,.12);border:1px solid rgba(106,110,67,.28);font-size:.92rem;color:var(--monte)}
.tip b{font-weight:500}

/* related links */
.related{background:var(--bruma)}
.related .head{text-align:center;max-width:40ch;margin:0 auto}
.rgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:44px}
@media(max-width:760px){.rgrid{grid-template-columns:1fr}}
.rcardx{border:1px solid rgba(52,56,31,.16);border-radius:8px;padding:26px;background:#fff;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.rcardx:hover{transform:translateY(-4px);box-shadow:0 20px 44px rgba(52,56,31,.14)}
.rcardx .k{font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--moss)}
.rcardx h4{font-family:'Fraunces',serif;font-variation-settings:'WONK' 1;font-weight:400;font-size:1.3rem;color:var(--monte);margin:8px 0 6px}
.rcardx p{font-size:.92rem;line-height:1.55;color:var(--ink);opacity:.82}
.rcardx .go{margin-top:12px;font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--moss)}

/* inquiry form */
.inquire{background:var(--monte);color:var(--bruma)}
.inquire .eyebrow{color:var(--citrino)}.inquire .section-title{color:var(--bruma)}
.inquire .head{text-align:center;max-width:44ch;margin:0 auto}
.inquire .head .body{color:var(--bruma);opacity:.84;margin-inline:auto}
.iform{max-width:680px;margin:44px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.iform .full{grid-column:1 / -1}
.ifield{display:flex;flex-direction:column;gap:7px}
.ifield label{font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--citrino);opacity:.9}
.ifield input,.ifield select,.ifield textarea{background:rgba(246,244,234,.06);border:1px solid rgba(233,236,160,.28);border-radius:8px;padding:13px 14px;font-family:'Jost';font-size:1rem;color:var(--bruma);font-weight:300;transition:border-color .25s var(--ease),background .25s var(--ease)}
.ifield input::placeholder,.ifield textarea::placeholder{color:rgba(246,244,234,.45)}
.ifield input:focus,.ifield select:focus,.ifield textarea:focus{outline:none;border-color:var(--citrino);background:rgba(246,244,234,.1)}
.ifield select option{color:#15160E}
.iform textarea{resize:vertical;min-height:120px}
.iform .submit{grid-column:1 / -1;display:flex;justify-content:center;margin-top:6px}
.iform .submit .btn{padding:1em 2.4em}
.formnote{text-align:center;margin:16px auto 0;font-size:.8rem;color:var(--bruma);opacity:.66}
.hp{position:absolute;left:-9999px}
@media(max-width:620px){.iform{grid-template-columns:1fr}}

/* cta */
.gcta{position:relative;color:var(--bruma);text-align:center;overflow:hidden;background:var(--monte)}
.gcta .bg{position:absolute;inset:0;z-index:0}
.gcta .bg img{width:100%;height:100%;object-fit:cover}
.gcta::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(52,56,31,.8),rgba(21,22,14,.86))}
.gcta .inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center}
.gcta .section-title{color:var(--bruma);max-width:18ch}
.gcta .sub{margin-top:14px;max-width:44ch;opacity:.9}
.gcta .cta{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap;justify-content:center}

/* footer */
footer{background:var(--monte);color:var(--bruma);padding:72px var(--gap) 40px;position:relative;z-index:2;text-align:center}
footer .wordmark{font-size:2.1rem;color:var(--bruma)}
footer .wmsub{color:var(--citrino)}
.flinks{margin:28px auto 0;display:flex;gap:22px;flex-wrap:wrap;justify-content:center}
.flinks a{color:var(--bruma);opacity:.82;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase}
.flinks a:hover{opacity:1}
.footnote{max-width:var(--maxw);margin:40px auto 0;padding-top:22px;border-top:1px solid rgba(233,236,160,.18);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;opacity:.6}

/* reveal */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}.reveal.d2{transition-delay:.16s}.reveal.d3{transition-delay:.24s}.reveal.d4{transition-delay:.32s}
@media(prefers-reduced-motion:reduce){*{animation:none!important}.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}.ghero .bg img{transform:none!important}}