/* ===========================================================================
   LUKE & LUKA — GEN-4 SHARED STYLESHEET  (ll.css)
   Single source of truth for the site design system. Cached across all pages
   (0 bytes on repeat visit). Self-hosted fonts — NO Google Fonts.
   DISPLAY: Playfair Display (Didone, matched to the LUKE & LUKA wordmark).
   BODY:    Inter, 18px desktop / 17px mobile, lh 1.75.
   PALETTE: navy #0B1220 · gold #B08D57 (logo seal) · bright #C9A24E · ivory #F8F7F3.
   RHYTHM:  dark navy hero -> warm ivory content -> dark footer.
   Consumed by pages as: async-loaded <link rel="preload" ... rel='stylesheet'>.
   Above-the-fold slice is duplicated inline per page as critical CSS for
   instant first paint; this file remains the complete, standalone stylesheet.
   =========================================================================== */

/* ---- Self-hosted fonts (woff2 at /assets/fonts/) -------------------------- */
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/playfair-display-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/playfair-display-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/inter-latin-400-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url('/assets/fonts/inter-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/inter-latin-600-normal.woff2') format('woff2')}

/* ---- Tokens -------------------------------------------------------------- */
:root{
  --navy:#0B1220;--navy-2:#131C2E;--navy-foot:#080F1E;
  --gold:#B08D57;--gold-bright:#C9A24E;--gold-soft:rgba(176,141,87,0.10);
  --ink:#1A2130;--ink-soft:#4B5563;--muted:#6B7280;
  --on-dark:#C7D2E6;--on-dark-soft:rgba(255,255,255,0.55);
  --white:#FFFFFF;--ivory:#F8F7F3;--surface:#F3EEE4;
  --border:#E7E1D7;--border-dk:#D6CEC2;--border-dark:rgba(255,255,255,0.10);
  --serif:'Playfair Display',Georgia,'Times New Roman',serif;
  --sans:'Inter',ui-sans-serif,system-ui,-apple-system,'Segoe UI',sans-serif;
  --container:1180px;--measure:68ch;--pad-x:clamp(20px,5vw,44px);--sec-y:clamp(56px,7vw,92px);
  --r-sm:3px;--r-md:6px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{font-family:var(--sans);font-size:18px;line-height:1.75;color:var(--ink);background:var(--white);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:var(--navy);text-decoration:none}
strong{font-weight:600;color:var(--ink)}
::selection{background:rgba(176,141,87,0.22)}
.container{max-width:var(--container);margin:0 auto;padding:0 var(--pad-x)}
.eyebrow{display:inline-flex;align-items:center;gap:12px;font-family:var(--sans);font-size:0.72rem;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--gold);margin:0 0 20px}
.eyebrow::before{content:"";width:26px;height:1px;background:var(--gold);opacity:0.8}
.skip-link{position:absolute;top:-100%;left:1rem;z-index:9999;background:var(--gold);color:var(--navy);padding:9px 18px;font-weight:600;border-radius:0 0 var(--r-sm) var(--r-sm);font-size:0.9rem}
.skip-link:focus{top:0}
.site-header{position:sticky;top:0;z-index:200;background:var(--navy);border-bottom:1px solid var(--border-dark)}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:70px;max-width:var(--container);margin:0 auto;padding:0 var(--pad-x)}
.logo{display:flex;align-items:center;flex-shrink:0}
.logo img{display:block;height:42px;width:auto}
.nav-desk{display:flex;align-items:center}
.nav-list{list-style:none;display:flex;gap:2px}
.nav-list a{display:block;color:var(--on-dark);font-size:0.82rem;font-weight:500;letter-spacing:0.02em;padding:8px 12px;border-radius:var(--r-sm);transition:color .15s,background .15s}
.nav-list a:hover{color:var(--white);background:rgba(255,255,255,0.05)}
.nav-list a[aria-current]{color:var(--gold-bright)}
.mob-menu-btn{display:none;flex-direction:column;justify-content:center;gap:5px;background:none;border:none;cursor:pointer;width:42px;height:42px;padding:9px}
.mob-menu-btn span{height:2px;background:var(--on-dark);border-radius:1px;transition:.2s}
.mob-menu-btn[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mob-menu-btn[aria-expanded="true"] span:nth-child(2){opacity:0}
.mob-menu-btn[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.nav-mob{display:none;background:var(--navy-2);border-top:1px solid var(--border-dark)}
.nav-mob.is-open{display:block}
.nav-mob ul{list-style:none;padding:8px 0}
.nav-mob ul a{display:block;color:var(--on-dark);font-size:0.98rem;font-weight:500;padding:14px var(--pad-x);border-bottom:1px solid rgba(255,255,255,0.04)}
.nav-mob ul a:hover{color:var(--gold-bright)}
.breadcrumb-band{background:var(--navy);border-bottom:1px solid var(--border-dark);padding:11px 0}
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:8px;font-size:0.78rem;color:var(--on-dark-soft)}
.breadcrumb li+li::before{content:"\203A";margin-right:8px;color:rgba(255,255,255,0.3)}
.breadcrumb a{color:var(--on-dark-soft);transition:color .15s}
.breadcrumb a:hover{color:var(--gold-bright)}
.breadcrumb [aria-current]{color:var(--on-dark)}
.page-hero{background:var(--navy);padding:clamp(60px,8vw,104px) 0 clamp(52px,7vw,88px)}
.page-hero .container{max-width:960px}
.page-hero h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.3rem,5vw,3.9rem);line-height:1.1;letter-spacing:-0.015em;color:var(--white);margin:0 0 22px;max-width:15ch}
.hero-sub{font-size:clamp(1.05rem,1.6vw,1.2rem);line-height:1.7;color:var(--on-dark);max-width:60ch}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:30px}
.hero-meta span{font-size:0.72rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:var(--on-dark-soft)}
.hero-meta .dot{color:var(--gold)}
.intro-section{background:var(--ivory);padding:var(--sec-y) 0;border-bottom:1px solid var(--border)}
.intro-grid{display:grid;grid-template-columns:1fr 320px;gap:clamp(40px,5vw,72px);align-items:start}
.intro-content h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.18;color:var(--navy);letter-spacing:-0.01em;margin:0 0 24px}
.intro-content p{font-size:1.06rem;line-height:1.8;color:var(--ink);margin:0 0 20px;max-width:var(--measure)}
.intro-content p:last-child{margin-bottom:0}
.side-card{background:var(--white);border:1px solid var(--border);border-top:2px solid var(--gold);border-radius:0 0 var(--r-md) var(--r-md);padding:24px 22px;margin-bottom:20px}
.side-card:last-child{margin-bottom:0}
.side-card h4{font-family:var(--sans);font-size:0.72rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--muted);margin:0 0 16px}
.side-card dl{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:0.95rem}
.side-card dt{color:var(--muted);font-weight:500}
.side-card dd{color:var(--ink)}
.side-card dd a{color:var(--gold);font-weight:500}
.side-note{font-size:0.9rem;line-height:1.6;color:var(--muted);margin-top:14px}
.side-links{list-style:none;display:flex;flex-direction:column;gap:11px}
.side-links a{display:flex;gap:9px;font-size:0.95rem;line-height:1.5;color:var(--ink);transition:color .15s}
.side-links a::before{content:"\2192";color:var(--gold);flex-shrink:0}
.side-links a:hover{color:var(--gold)}
.engagement-section{background:var(--white);padding:var(--sec-y) 0}
.engagement-section h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.18;color:var(--navy);letter-spacing:-0.01em;margin:0 0 8px}
.section-sub{font-size:1.05rem;color:var(--ink-soft);margin:0 0 clamp(32px,4vw,48px);max-width:var(--measure)}
.steps{display:flex;flex-direction:column;border-top:1px solid var(--border)}
.step{display:grid;grid-template-columns:64px 1fr;gap:clamp(20px,3vw,34px);padding:clamp(24px,3vw,32px) 0;border-bottom:1px solid var(--border)}
.step-num{font-family:var(--serif);font-size:2.1rem;font-weight:500;color:var(--gold);line-height:1;opacity:0.9}
.step-body h3{font-family:var(--sans);font-size:1.12rem;font-weight:600;color:var(--navy);margin:0 0 9px;line-height:1.35}
.step-body p{font-size:1.02rem;line-height:1.75;color:var(--ink-soft);margin:0;max-width:64ch}
.step-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px}
.tag{font-size:0.68rem;font-weight:600;letter-spacing:0.07em;text-transform:uppercase;color:var(--gold);background:var(--gold-soft);border:1px solid rgba(176,141,87,0.25);padding:4px 10px;border-radius:100px}
.forum-band{background:var(--navy);padding:clamp(44px,6vw,68px) 0}
.forum-band .eyebrow{color:var(--gold-bright)}
.forum-band .eyebrow::before{background:var(--gold-bright)}
.forum-note{max-width:82ch}
.forum-note p{font-size:1.05rem;line-height:1.85;color:var(--on-dark);margin:0 0 18px}
.forum-note p:last-child{margin-bottom:0}
.forum-note strong{color:var(--white);font-weight:600}
.faq-section{background:var(--ivory);padding:var(--sec-y) 0}
.faq-section h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.18;color:var(--navy);letter-spacing:-0.01em;margin:0 0 clamp(28px,3vw,40px)}
.faq-list{border-top:1px solid var(--border-dk)}
details.faq{border-bottom:1px solid var(--border-dk)}
details.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:22px 0;font-size:1.1rem;font-weight:600;color:var(--navy);transition:color .15s}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+";font-family:var(--sans);font-size:1.5rem;font-weight:400;color:var(--gold);flex-shrink:0;line-height:1}
details.faq[open] summary{color:var(--gold)}
details.faq[open] summary::after{content:"\2212"}
details.faq .faq-a{padding:0 0 24px;max-width:var(--measure)}
details.faq .faq-a p{font-size:1.02rem;line-height:1.8;color:var(--ink-soft)}
.enquiry-section{background:var(--surface);border-top:3px solid var(--gold);padding:var(--sec-y) 0}
.enquiry-section h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,2.8vw,2.3rem);line-height:1.18;color:var(--navy);letter-spacing:-0.01em;margin:0 0 18px}
.enquiry-section p{font-size:1.08rem;line-height:1.75;color:var(--ink-soft);max-width:64ch;margin:0 0 14px}
.enquiry-note{font-size:0.92rem!important;color:var(--muted)!important;font-style:italic;margin-bottom:30px!important}
.cta-links{display:flex;flex-wrap:wrap;gap:12px}
.btn{display:inline-flex;align-items:center;padding:13px 26px;border-radius:var(--r-sm);font-size:0.92rem;font-weight:600;transition:.15s}
.btn-primary{background:var(--gold);color:var(--navy);border:1.5px solid var(--gold)}
.btn-primary:hover{background:transparent;color:var(--navy)}
.btn-ghost{background:transparent;color:var(--navy);border:1.5px solid var(--border-dk)}
.btn-ghost:hover{border-color:var(--gold);color:var(--gold)}
.site-footer{background:var(--navy-foot);padding:clamp(56px,7vw,84px) 0 0}
.footer-inner{display:grid;grid-template-columns:1.7fr 1fr 1fr;gap:clamp(36px,5vw,64px);padding-bottom:clamp(40px,5vw,56px);border-bottom:1px solid var(--border-dark);max-width:var(--container);margin:0 auto;padding-left:var(--pad-x);padding-right:var(--pad-x)}
.footer-brand{display:flex;flex-direction:column;gap:8px}
.footer-seal{width:52px;height:52px;margin-bottom:6px}
.footer-name{font-family:var(--serif);font-size:1.3rem;font-weight:600;color:var(--white)}
.footer-tagline{font-size:0.8rem;letter-spacing:0.02em;color:var(--gold)}
.footer-desc{font-size:0.92rem;line-height:1.75;color:var(--on-dark);opacity:0.72;margin-top:8px;max-width:38ch}
.footer-col h4{font-family:var(--sans);font-size:0.72rem;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:var(--gold);margin:0 0 18px}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:11px}
.footer-col a{font-size:0.94rem;color:var(--on-dark);opacity:0.82;transition:.15s}
.footer-col a:hover{color:var(--gold-bright);opacity:1}
.footer-col address{font-style:normal;font-size:0.94rem;line-height:1.75;color:var(--on-dark);opacity:0.82;margin-bottom:12px}
.footer-col p{font-size:0.94rem;line-height:1.7;color:var(--on-dark);opacity:0.82;margin-top:8px}
.footer-col p a{color:var(--on-dark)}
.footer-base{background:rgba(0,0,0,0.25);padding:24px 0}
.footer-base .container{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.bci-note{font-size:0.76rem;line-height:1.7;color:var(--on-dark);opacity:0.5;max-width:74ch}
.footer-legal{display:flex;gap:20px;flex-shrink:0}
.footer-legal a{font-size:0.76rem;color:var(--on-dark);opacity:0.62;transition:.15s}
.footer-legal a:hover{color:var(--gold-bright);opacity:1}
@media(max-width:1024px){.intro-grid{grid-template-columns:1fr 280px;gap:44px}.footer-inner{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}}
@media(max-width:768px){.nav-desk{display:none}.mob-menu-btn{display:flex}.intro-grid{grid-template-columns:1fr;gap:0}.intro-sidebar{order:-1;margin-bottom:40px}.footer-inner{grid-template-columns:1fr;gap:32px}.footer-brand{grid-column:auto}.footer-base .container{flex-direction:column;align-items:flex-start}}
@media(max-width:520px){body{font-size:17px}.step{grid-template-columns:46px 1fr;gap:16px}.step-num{font-size:1.6rem}.cta-links{flex-direction:column}.btn{justify-content:center}}
@media(prefers-reduced-motion:reduce){*{transition-duration:.01ms!important}}