/* Single committed brand look (River & Dusk palette), light only by design */
:root{--paper:#FAF6EF;--ink:#1B1A17;color-scheme:light}
html,body{background:var(--paper);color:var(--ink)}
body{margin:0;font-family:Montserrat,system-ui,sans-serif;overflow-x:hidden}
button,input,select,textarea{font-family:inherit}

body{margin:0;background:#FFFFFF}
a{color:#0B3A40}a:hover{color:#13707A}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #F58C28;outline-offset:2px}
.ph-d{position:relative;background:repeating-linear-gradient(135deg,#0F3C43 0 14px,#13464E 14px 28px);overflow:hidden}
.cap{padding:6px 10px;background:rgba(27,26,23,.78);color:#fff;font:500 12px/1.35 Montserrat,system-ui,sans-serif;border-radius:4px;max-width:85%}
.lbl{font:600 12px/1 Montserrat,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#6E675D}
.h2{margin:0;font-family:Montserrat,system-ui,sans-serif;font-weight:800;font-size:clamp(28px,3.2vw,40px);line-height:1.1;letter-spacing:-.02em;color:#1B1A17;text-wrap:balance}
.wrap{max-width:1240px;margin:0 auto;padding:0 32px;box-sizing:border-box;width:100%}
.pill{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:#EB1E23;color:#FFFFFF;border:0;border-radius:999px;padding:0 24px;height:46px;font:700 13px Montserrat,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;text-decoration:none}
.more{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:10px;font:700 13px Montserrat,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#1B1A17;padding:8px 0}
.arrow{width:46px;height:46px;border-radius:999px;border:0;background:#1B1A17;color:#FFFFFF;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.arrow-l{width:46px;height:46px;border-radius:999px;border:1.5px solid #1B1A17;background:transparent;color:#1B1A17;font-size:18px;cursor:pointer;display:flex;align-items:center;justify-content:center}
.sel{font:500 14px Montserrat,sans-serif;padding:10px 12px;border:1px solid #D6D0C6;border-radius:6px;background:#FFFFFF;color:#1B1A17;min-height:44px}
.grid3{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(300px,100%),1fr));gap:24px}
.grid4{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(240px,100%),1fr));gap:20px}
/* motion & interaction */
.hero-in>*{animation:fadeUp .9s cubic-bezier(.2,.7,.2,1) both}.hero-in>*:nth-child(2){animation-delay:.12s}.hero-in>*:nth-child(3){animation-delay:.24s}.hero-in>*:nth-child(4){animation-delay:.36s}.hero-in>*:nth-child(5){animation-delay:.5s}
@keyframes fadeUp{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes slideIn{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}}
@keyframes popIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
@keyframes dropIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%,0)}}
.screen-in{animation:fadeIn .45s ease both}.mega-in{animation:dropIn .25s ease both}.drawer-in{animation:slideIn .35s cubic-bezier(.2,.7,.2,1) both}.pop-in{animation:popIn .35s cubic-bezier(.2,.7,.2,1) both}.toast-in{animation:toastIn .3s ease both}
.navi::after{content:'';position:absolute;left:10px;right:10px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:#EB1E23;transform:scaleX(0);transform-origin:center;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.navi:hover::after,.navi[data-on="1"]::after{transform:scaleX(1)}.navi:hover{color:#EB1E23 !important}
.pill{transition:transform .2s ease,box-shadow .2s ease,filter .2s ease,background-color .2s ease !important}.pill:hover{transform:translateY(-2px) !important;box-shadow:0 8px 18px rgba(27,26,23,.18) !important;filter:brightness(1.04)}.pill:active{transform:translateY(0) !important}
.more{transition:gap .25s ease,color .2s ease !important}.more:hover{gap:16px !important;color:#A84A32 !important}
.arrow,.arrow-l{transition:transform .2s ease,background-color .2s ease}.arrow:hover,.arrow-l:hover{transform:scale(1.08)}
button[role=tab],button[aria-pressed]{transition:background-color .2s ease,color .2s ease,border-color .2s ease,transform .2s ease !important}button[role=tab]:hover,button[aria-pressed]:hover{transform:translateY(-1px) !important}
.lift,.grid3>article,.grid4>article,.grid4>button,.mte-small>button,.mte-big,.hood-c{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease !important}
.lift:hover,.grid3>article:hover,.grid4>article:hover,.grid4>button:hover,.mte-small>button:hover,.mte-big:hover,.hood-c:hover{transform:translateY(-5px) !important;box-shadow:0 16px 34px rgba(27,26,23,.14) !important}
.lift img,.grid3>article img,.grid4>article img,.grid4>button img,.mte-small>button img,.mte-big>img,.hood-c img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.lift:hover img,.grid3>article:hover img,.grid4>article:hover img,.grid4>button:hover img,.mte-small>button:hover img,.mte-big:hover>img,.hood-c:hover img{transform:scale(1.05)}
.rv{opacity:0 !important;transform:translateY(26px) !important}.rv.rv-in{opacity:1 !important;transform:none !important;transition:opacity .75s cubic-bezier(.2,.7,.2,1),transform .75s cubic-bezier(.2,.7,.2,1) !important}
.totop:hover{background:#F58C28 !important;color:#1B1A17 !important}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}
@keyframes rotw{0%,26%{transform:translateY(0)}33%,59%{transform:translateY(-1.3em)}66%,92%{transform:translateY(-2.6em)}100%{transform:translateY(-3.9em)}}
.rot-in{animation:rotw 7.5s cubic-bezier(.7,0,.3,1) infinite}
@media (prefers-reduced-motion:reduce){.rot-in{animation:none}}
@keyframes ptscroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.pt-track{animation:ptscroll 45s linear infinite}
.pt-viewport:hover .pt-track{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.pt-track{animation:none}.pt-viewport{overflow-x:auto !important}}
@media (max-width:1460px){.nav .navi{padding:0 8px !important;font-size:12px !important;letter-spacing:.02em !important}}
@media (max-width:1120px){.nav .navi{padding:0 5px !important;font-size:11px !important}.hdr-tag{display:none !important}}
@media (max-width:600px){.hdr-heart{display:none !important}.totop{right:22px !important;bottom:146px !important;width:44px !important;height:44px !important}.mte-cred{top:48px !important;left:16px;right:auto !important;font-size:9px !important;max-width:80% !important}.hdr-row{gap:8px !important}.hdr-logo{height:38px !important}.hdr-ask{padding:0 12px !important;font-size:11px !important;letter-spacing:.04em !important;height:38px !important}.mte-big{min-height:340px !important}.mte-pil{display:none !important}.mte-small{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:12px !important}.mte-sub{display:none !important}}
@media (max-width:960px){.hdr-burger{display:flex !important}.nav{display:none !important}.wrap{padding:0 16px}.split{grid-template-columns:1fr !important}}

@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* ---- Server-rendered site (Blade + Alpine) ---- */
[x-cloak]{display:none !important}
.sr-only{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:#1B1A17;color:#fff;padding:10px 16px;border-radius:999px}.skip:focus{left:16px}
.site{font-family:Montserrat,system-ui,sans-serif;color:#1B1A17;background:#FFFFFF;display:flex;flex-direction:column;min-height:100vh}
main{display:flex;flex-direction:column}
.hdr{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:#FFFFFF;border-bottom:1px solid #E7E2DA;transition:box-shadow .3s ease}
.hdr.is-scrolled{box-shadow:0 6px 20px rgba(27,26,23,.08)}
.hdr-row{height:76px;transition:height .3s ease;display:flex;align-items:center;justify-content:space-between;gap:20px}
.hdr.is-scrolled .hdr-row{height:64px}
.hdr-logo{height:48px;width:auto;display:block;transition:height .3s ease}
.hdr.is-scrolled .hdr-logo{height:40px}
.navi{position:relative;display:flex;align-items:center;padding:0 12px;font-size:13px;font-weight:600;letter-spacing:.04em;white-space:nowrap;box-sizing:border-box;height:100%;transition:color .2s ease;text-decoration:none;text-transform:uppercase}
.mega{position:absolute;left:0;right:0;top:100%;background:#FFFFFF;border-top:1px solid #E7E2DA;box-shadow:0 18px 30px rgba(27,26,23,.12)}
.mega-link{font-size:15px;padding:6px 0;color:#1B1A17;text-decoration:none}.mega-link:hover{color:#EB1E23}
.lang-btn{display:flex;align-items:center;gap:6px;height:42px;border:1px solid #D6D0C6;border-radius:999px;background:#FFFFFF;padding:0 12px;font:700 13px Montserrat,sans-serif;color:#1B1A17;text-decoration:none;box-sizing:border-box}
.ft-link{display:flex;align-items:center;gap:10px;font-size:16px;color:#4A453E;text-transform:uppercase;padding:2px 0;text-decoration:none}.ft-link:hover{color:#A84A32}
.mnav-link{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;font:700 15px Montserrat,sans-serif;letter-spacing:.04em;text-decoration:none;text-transform:uppercase}
.ai-prompt{text-align:left;background:#FFFFFF;border:1px solid #EB1E23;border-radius:10px;padding:12px 14px;font:500 14px Montserrat,sans-serif;cursor:pointer;color:#1B1A17}
.ai-card{width:100%;box-sizing:border-box;background:#FFFFFF;border:1px solid #E7E2DA;border-radius:8px;padding:10px;display:flex;gap:12px;align-items:center;color:#1B1A17;text-decoration:none}
.mo-box{background:#F4F1EC;border-radius:6px;padding:14px;display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:1.5}
.totop{position:fixed;right:40px;bottom:200px;z-index:64;width:48px;height:48px;border-radius:999px;border:0;background:#1B1A17;color:#FFFFFF;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(27,26,23,.25);opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .3s ease,transform .3s ease,background-color .2s ease}
.totop.on{opacity:1;transform:none;pointer-events:auto}
a.pill{text-decoration:none}a.more{text-decoration:none}
.chip{text-decoration:none}
.card-link{color:inherit;text-decoration:none}
.crumbs a{color:inherit;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#D6D0C6}
.crumbs a:hover{color:#A84A32}
.pager{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.pager a,.pager span{min-width:40px;height:40px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:0 12px;box-sizing:border-box;font:600 14px Montserrat,sans-serif;border:1px solid #BDB6AB;color:#1B1A17;text-decoration:none}
.pager .cur{background:#1B1A17;color:#FFFFFF;border-color:#1B1A17}
.grid3>a,.grid4>a{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease !important}
.grid3>a:hover,.grid4>a:hover{transform:translateY(-5px) !important;box-shadow:0 16px 34px rgba(27,26,23,.14) !important}
.grid3>a img,.grid4>a img{transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.grid3>a:hover img,.grid4>a:hover img{transform:scale(1.05)}
.hood-track{display:flex;gap:20px;transition:transform .35s ease}
section[id^="home-"]{scroll-margin-top:90px}

/* Article / page body (WYSIWYG HTML) — mirrors the prototype's story template */
.prose{display:flex;flex-direction:column;gap:22px;font-size:17px;line-height:1.8;color:#2E2A25}
.prose>*{margin:0}
.prose h2{margin-top:10px;font-family:Montserrat,system-ui,sans-serif;font-weight:800;font-size:26px;line-height:1.15;letter-spacing:-.02em;color:#1B1A17}
.prose h3{font-family:Montserrat,system-ui,sans-serif;font-weight:700;font-size:21px;line-height:1.25;color:#1B1A17}
.prose a{color:#0B3A40;text-decoration:underline;text-underline-offset:3px}
.prose ul,.prose ol{padding-left:22px;display:flex;flex-direction:column;gap:6px}
.prose blockquote{margin:8px 0;border-left:3px solid #F58C28;padding:4px 0 4px 22px;display:flex;flex-direction:column;gap:10px}
.prose blockquote p{margin:0;font-family:Montserrat,system-ui,sans-serif;font-size:24px;line-height:1.45;color:#1B1A17}
.prose blockquote cite,.prose blockquote footer{font-style:normal;font-size:13px;color:#6E675D}
.prose figure{margin:0;display:flex;flex-direction:column;gap:6px}
.prose figure img,.prose img{max-width:100%;height:auto;border-radius:6px;display:block}
.prose figcaption{font-size:12px;color:#6E675D;line-height:1.5}
.prose .gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr));gap:12px}
.prose .gallery figure img{aspect-ratio:4/3;object-fit:cover;width:100%}
.prose .tip,.prose aside{background:#F4F1EC;border-radius:6px;padding:18px 20px;display:flex;flex-direction:column;gap:6px;font-size:15px;line-height:1.6}
.prose .tip>*{margin:0}
.prose .tip strong:first-child,.prose .tip .lbl{font:600 12px/1 Montserrat,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#0B3A40}
.prose table{border-collapse:collapse;width:100%;font-size:15px}.prose td,.prose th{border:1px solid #E7E2DA;padding:8px 10px;text-align:left}
.prose iframe{max-width:100%;border:0;border-radius:6px;aspect-ratio:16/9;width:100%;height:auto}
@media (max-width:960px){.hdr-row{height:64px}}
.d-flex{display:flex}
.side-sticky{position:sticky;top:92px}
@media (max-width:1100px){.side-sticky{position:static}}
