/*
Theme Name: Travels with Somm
Theme URI: https://travelswithsomm.com
Author: Linda Hamilton-Evans
Description: A small literary wine-and-place journal. Custom lightweight theme built from the approved mockup (v3.5). No page builder.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 8.0
License: Proprietary
Text Domain: tws
*/


/* Layout: the real website, one page per tab (Home, Journal story, Curation, About), Draft 3 palette, one fixed light look as the live site will be. Yellow notes are review flags and can be hidden. */
:root{
  --paper:#FBF8F2; --white:#FFFFFF; --ink:#2B2A28; --soft:#5D5A54; --rule:#E5DFD3; --mist:#F2EDE2;
  --olive:#4B5A2E; --oliveDk:#2F3A1E; --burg:#6B1F2A; --gold:#A88A4A; --golddk:#7E6324; --terra:#A85536; --charcoal:#2B2A28;
  --onDark:#F3EDE3; --onDarkSoft:#D3CABC; --goldLight:#D9BE85;
  --flagBg:#FFF0C2; --flagFg:#5E4100;
  --display:"Bodoni Moda","Didot",Georgia,serif;
  --body:"Figtree","Helvetica Neue",Arial,sans-serif;
  --gut:clamp(16px,4.5vw,56px);
  color-scheme:light;
}
*{box-sizing:border-box}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:18px;line-height:1.65;margin:0}
img{max-width:100%;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
h1,h2,h3{font-family:var(--display);font-weight:500;line-height:1.1;text-wrap:balance;margin:0}
p{margin:0}
.kicker{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--golddk)}
.btn{display:inline-block;font:600 16px/1.2 var(--body);padding:14px 26px;border-radius:3px;border:2px solid var(--burg);background:var(--burg);color:#fff;text-decoration:none;cursor:pointer}
.btn.ghost{background:transparent;color:var(--burg)}
.more{font-weight:700;color:var(--burg);font-size:15px;text-decoration:none;border-bottom:2px solid var(--gold);padding-bottom:2px}
.ph{position:relative;overflow:hidden;background:var(--mist)}
.ph img{width:100%;height:100%;object-fit:cover}
.cap{font-size:13px;color:var(--soft);margin-top:8px}


/* nav */
.nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:20px;padding-inline:var(--gut);border-bottom:1px solid var(--rule);background:var(--paper)}
.logo{text-decoration:none;color:var(--burg);font-family:var(--display);font-size:26px;line-height:1.1}
.logo small{display:block;font:600 10px/1.4 var(--body);letter-spacing:.32em;text-transform:uppercase;color:var(--golddk);margin-top:3px}
.menu{display:flex;gap:28px;align-items:center;font-size:15px;font-weight:600}
.menu a{text-decoration:none;padding-bottom:3px;border-bottom:2px solid transparent}
.menu a[aria-current="page"]{border-bottom-color:var(--gold)}
.menu a.cur-link{color:var(--burg);padding-left:22px;border-left:1px solid var(--rule)}
.menu a.cur-link::after{content:"";display:block;height:1px;background:var(--gold);margin-top:2px}
.menu a.cur-link[aria-current="page"]::after{display:none}
.menu .btn{padding:10px 18px;font-size:14px;border-bottom:2px solid var(--burg)}
.burger{display:none;width:26px;gap:5px}
.burger i{height:2px;background:var(--ink);display:block}
@media (max-width:900px){.menu{display:none}.burger{display:grid}}

section{padding-block:clamp(48px,8vw,96px);padding-inline:var(--gut)}

/* home hero */
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(28px,5vw,64px);align-items:center;padding-block:clamp(36px,6vw,72px)}
.hero h1{font-size:clamp(40px,5.6vw,68px);margin:16px 0 22px;line-height:1.04}
.hero .lede{font-size:clamp(18px,1.6vw,20px);color:var(--soft);max-width:30em;margin-bottom:28px}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:22px}
.byline{font-size:14px;color:var(--soft);font-weight:600;letter-spacing:.03em}
.hero .ph{aspect-ratio:4/3.1}
@media (max-width:820px){.hero{grid-template-columns:minmax(0,1fr)}.hero .ph{order:-1;margin-inline:calc(var(--gut) * -1)}}

/* story cards */
.head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:32px}
.head h2{font-size:clamp(32px,3.6vw,44px);margin-top:8px}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:820px){.cards{grid-template-columns:minmax(0,1fr)}}
.card{text-decoration:none;display:block}
.card .ph{aspect-ratio:4/3;margin-bottom:16px}
@media (max-width:820px){.cards{gap:44px}.cards .card + .card{border-top:1px solid var(--rule);padding-top:28px}}
.tagline{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--olive)}
.card h3{font-size:25px;line-height:1.2;margin:6px 0 8px}
.card p{font-size:16px;color:var(--soft)}

/* earth to glass band */
.etg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);background:var(--burg);color:var(--onDark);padding:0}
.etg .ph{min-height:420px;background:#4a1520}
.etg .txt{padding-block:clamp(44px,6vw,80px);padding-inline:clamp(20px,5vw,64px);display:flex;flex-direction:column;justify-content:center;gap:18px}
.etg .kicker{color:var(--goldLight)}
.etg h2{color:#fff;font-size:clamp(36px,4.4vw,52px)}
.etg p{color:var(--onDarkSoft);font-size:19px;max-width:32em}
.etg .parts{font-family:var(--display);font-style:italic;font-size:17px;color:var(--goldLight);line-height:1.6}
.etg .btn{background:var(--goldLight);border-color:var(--goldLight);color:#3A1016;align-self:flex-start}
@media (max-width:820px){.etg{grid-template-columns:minmax(0,1fr)}.etg .ph{min-height:300px}}

/* field notes */
.fn{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
@media (max-width:820px){.fn{grid-template-columns:minmax(0,1fr)}}
.fn .c{border-top:2px solid var(--terra);padding-top:16px}
.fn .c h3{font-size:23px;line-height:1.25;margin:6px 0}
.fn .c p{font-size:15px;color:var(--soft)}

/* taste the landscape (compact) */
.ttl{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--mist);padding:0}
.ttl .txt{padding-block:clamp(40px,5vw,72px);padding-inline:var(--gut);display:flex;flex-direction:column;justify-content:center;gap:16px}
.ttl h2{font-size:clamp(30px,3.6vw,44px)}
.ttl p{color:var(--soft);max-width:32em}
.ttl .ph{min-height:420px}
.soils{display:flex;flex-wrap:wrap;gap:8px}
.soils button{font:700 11px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;padding:8px 11px;border-radius:2px;border:2px solid transparent;cursor:pointer}
.soils button[aria-pressed="true"]{border-color:var(--ink)}
.s1{background:#2B2A2E;color:#fff}.s2{background:#D9D2C0;color:#2B2A28}.s3{background:#A88E8A;color:#fff}.s4{background:#C9B98F;color:#2B2A28}.s5{background:#5F6F7C;color:#fff}
.soilline{font-size:16px;color:var(--ink);background:var(--white);border-left:3px solid var(--gold);padding:12px 16px;max-width:32em;min-height:4.5em}
@media (max-width:820px){.ttl{grid-template-columns:minmax(0,1fr)}.ttl .ph{min-height:300px}}

/* curation (home) */
.cur{background:var(--white);border-block:1px solid var(--rule)}
.cur .top{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center;margin-bottom:56px}
.cur h2{font-size:clamp(36px,4.4vw,52px);margin:12px 0 18px;line-height:1.06}
.cur .top p{font-size:19px;color:var(--soft);max-width:30em;margin-bottom:22px}
.cur .steps{font-size:15px;color:var(--olive);font-weight:600;margin-bottom:28px;letter-spacing:.02em}
.cur figure{margin:0}
.cur .ph{aspect-ratio:3/4;max-height:520px;margin-left:auto}
.doors{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}
.door{border-top:2px solid var(--terra);padding-top:18px;text-decoration:none;display:block}
.door h3{font-size:26px;margin-bottom:8px}
.door p{font-size:16px;color:var(--soft)}
@media (max-width:820px){.cur .top,.doors{grid-template-columns:minmax(0,1fr)}.cur .ph{margin:0}}

.sub{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,56px);align-items:center}
.sub h2{font-size:clamp(32px,3.6vw,42px);margin:8px 0 10px}
.sub p{color:var(--soft)}
.sub form{display:flex;gap:12px;flex-wrap:wrap}
.sub label{position:absolute;left:-9999px}
.sub input{flex:1 1 220px;min-width:0;font:inherit;font-size:16px;padding:14px 16px;border:1.5px solid #B9B2A8;border-radius:3px;background:var(--white);color:var(--ink)}
.ok{font-size:15px;color:var(--olive);font-weight:600;margin-top:10px}
@media (max-width:820px){.sub{grid-template-columns:minmax(0,1fr)}}

footer{background:var(--charcoal);color:var(--onDarkSoft);padding-block:48px;padding-inline:var(--gut);display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;font-size:14px}
footer b{display:block;color:#fff;font-family:var(--display);font-weight:500;font-size:22px;margin-bottom:6px}
footer .cols{display:flex;gap:48px;flex-wrap:wrap}
footer .cols div{display:grid;gap:6px;align-content:start}
footer a{text-decoration:none}

/* ===== journal story ===== */
.st-head{max-width:860px;margin:0 auto;text-align:center;padding-block:clamp(40px,7vw,88px) clamp(28px,4vw,44px)}
.st-head h1{font-size:clamp(38px,5.4vw,64px);line-height:1.06;margin:16px 0 18px}
.st-head .dek{font-size:clamp(18px,1.8vw,21px);color:var(--soft);max-width:34em;margin:0 auto 20px}
.st-hero{padding-block:0}
.st-hero .ph{aspect-ratio:16/8.5;max-height:640px}
.st-hero .cap{max-width:1200px}
.st-body{max-width:680px;margin:0 auto;padding-block:clamp(36px,5vw,56px) 0;padding-inline:var(--gut);box-sizing:content-box}
.st-body .prose{font-size:19px;line-height:1.78}
.prose{display:grid;gap:1.15em}
.prose .first::first-letter{font-family:var(--display);float:left;font-size:78px;line-height:.85;padding:6px 10px 0 0;color:var(--burg)}
.prose h2{font-size:30px;margin-top:.9em}
.pull{font-family:var(--display);font-style:italic;font-size:clamp(24px,2.6vw,30px);line-height:1.35;color:var(--burg);border-block:1px solid var(--gold);padding-block:24px;margin-block:.6em;text-align:center}
.inline-fig{margin:1.2em 0}
.inline-fig .ph{aspect-ratio:4/5}
.pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px;margin:1.4em 0 .4em}
.pair .ph{aspect-ratio:3/4}
@media (max-width:560px){.pair{grid-template-columns:minmax(0,1fr)}}
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;border-block:1px solid var(--rule);padding-block:20px;margin-top:2.2em;font-size:15px}
.facts dt{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--golddk)}
.facts dd{margin:4px 0 0}
@media (max-width:560px){.facts{grid-template-columns:minmax(0,1fr)}}
.author{display:grid;grid-template-columns:auto minmax(0,1fr);gap:18px;align-items:start;margin-top:32px;padding:22px;background:var(--white);border:1px solid var(--rule)}
.author .mono{width:56px;height:56px;border-radius:50%;background:var(--burg);color:#fff;display:grid;place-items:center;font-family:var(--display);font-size:22px}
.author p{font-size:16px;color:var(--soft)}
.author p b{color:var(--ink)}
.st-sub{max-width:680px;margin:40px auto 0;padding-inline:var(--gut);box-sizing:content-box}
.st-sub .inner{border-top:1px solid var(--rule);padding-top:28px;display:flex;justify-content:space-between;gap:20px;align-items:center;flex-wrap:wrap}
.st-sub h3{font-size:24px}
.st-sub p{font-size:16px;color:var(--soft)}

/* ===== curation page ===== */
.c-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:0;padding:0;background:var(--white);border-bottom:1px solid var(--rule)}
.c-hero .txt{padding-block:clamp(44px,7vw,96px);padding-inline:var(--gut);display:flex;flex-direction:column;justify-content:center;gap:20px}
.c-hero h1{font-size:clamp(40px,5.2vw,64px);line-height:1.04}
.c-hero p{font-size:clamp(18px,1.6vw,20px);color:var(--soft);max-width:30em}
.c-hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.c-hero .ph{min-height:520px}
@media (max-width:820px){.c-hero{grid-template-columns:minmax(0,1fr)}.c-hero .ph{min-height:300px;order:-1}}
.c-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(24px,5vw,72px)}
.c-intro h2{font-size:clamp(30px,3.4vw,40px)}
.c-intro .prose{font-size:19px;line-height:1.72;max-width:36em}
@media (max-width:820px){.c-intro{grid-template-columns:minmax(0,1fr)}}
.process{background:var(--mist)}
.process h2{font-size:clamp(30px,3.4vw,42px);margin:10px 0 36px}
.process ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:24px;counter-reset:s}
.process li{counter-increment:s;background:var(--white);padding:22px 20px;border-top:3px solid var(--burg)}
.process li::before{content:counter(s);display:block;font-family:var(--display);font-size:40px;line-height:1;color:var(--burg);margin-bottom:10px}
.process li b{display:block;font-size:17px;margin-bottom:6px}
.process li span{font-size:15px;color:var(--soft);display:block}
@media (max-width:1000px){.process ol{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.process ol{grid-template-columns:minmax(0,1fr)}}
.yacht{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:var(--oliveDk);color:var(--onDark);padding:0}
.yacht .txt{padding-block:clamp(48px,7vw,96px);padding-inline:var(--gut);display:flex;flex-direction:column;gap:18px;justify-content:center}
.yacht .kicker{color:var(--goldLight)}
.yacht h2{color:#fff;font-size:clamp(34px,4.2vw,52px)}
.yacht p{color:var(--onDarkSoft);font-size:18px;max-width:32em}
.yacht ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;font-size:16px;color:var(--onDark)}
.yacht li{padding-left:22px;position:relative}
.yacht li::before{content:"";position:absolute;left:0;top:.7em;width:10px;height:1px;background:var(--goldLight)}
.yacht .btn{background:var(--goldLight);border-color:var(--goldLight);color:#1f2914;align-self:flex-start}
.yacht .photo-needed{background:#3d4a28;display:grid;place-items:center;min-height:480px;padding:32px;text-align:center;color:var(--onDarkSoft);font-size:15px}
.yacht .photo-needed b{display:block;font-family:var(--display);font-weight:500;font-size:24px;color:var(--goldLight);margin-bottom:8px}
@media (max-width:820px){.yacht{grid-template-columns:minmax(0,1fr)}.yacht .photo-needed{min-height:260px}}
.svc{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(28px,5vw,72px);align-items:center}
.svc + .svc{padding-top:0}
.svc.flip .ph{order:2}
.svc .ph{aspect-ratio:4/5;max-height:560px}
.svc h2{font-size:clamp(30px,3.6vw,44px);margin:10px 0 16px}
.svc p{color:var(--soft);max-width:32em}
.svc p + p{margin-top:12px}
.svc figcaption{font-family:var(--display);font-style:italic;font-size:16px;color:var(--soft);margin-top:10px}
.svc figure{margin:0}
@media (max-width:820px){.svc{grid-template-columns:minmax(0,1fr)}.svc.flip .ph{order:0}}
.regions{border-top:1px solid var(--rule)}
.regions .row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:24px}
.regions .r{border-top:3px solid var(--burg);padding-top:14px}
.regions .r:nth-child(2){border-color:var(--olive)}.regions .r:nth-child(3){border-color:#2F6E8A}
.regions .r h3{font-size:28px}
.regions .r p{font-size:15px;color:var(--soft);margin-top:4px}
@media (max-width:820px){.regions .row{grid-template-columns:minmax(0,1fr)}}
.cred{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:center;background:var(--white);border-block:1px solid var(--rule)}
.cred .ph{aspect-ratio:4/3}
.cred h2{font-size:clamp(28px,3.2vw,38px);margin:10px 0 16px}
.cred ul{list-style:none;margin:16px 0 0;padding:0;border-top:1px solid var(--rule)}
.cred li{padding-block:11px;border-bottom:1px solid var(--rule);font-size:16px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.cred li span{color:var(--soft);font-size:14px}
@media (max-width:820px){.cred{grid-template-columns:minmax(0,1fr)}}
.quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px}
.quotes blockquote{margin:0;font-family:var(--display);font-size:24px;line-height:1.4;color:var(--ink);border-left:2px solid var(--gold);padding-left:22px}
.quotes cite{display:block;font:600 13px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--soft);margin-top:14px;font-style:normal}
@media (max-width:820px){.quotes{grid-template-columns:minmax(0,1fr)}}
.faq{max-width:820px}
.faq h2{font-size:clamp(28px,3.2vw,38px);margin-bottom:20px}
.faq details{border-top:1px solid var(--rule);padding-block:16px}
.faq details:last-of-type{border-bottom:1px solid var(--rule)}
.faq summary{font-weight:600;font-size:18px;cursor:pointer;list-style-position:outside}
.faq details p{color:var(--soft);margin-top:10px;font-size:17px;max-width:40em}
.enquire{background:var(--mist);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(28px,5vw,72px)}
.enquire h2{font-size:clamp(32px,3.8vw,46px);margin:10px 0 14px}
.enquire .lead p{color:var(--soft)}
.enquire .lead p + p{margin-top:12px}
.enquire form{display:grid;gap:16px;background:var(--white);padding:clamp(20px,3vw,32px);border:1px solid var(--rule)}
.enquire .row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.enquire label{display:grid;gap:6px;font-size:14px;font-weight:600}
.enquire input,.enquire select,.enquire textarea{font:inherit;font-size:16px;font-weight:400;padding:12px 14px;border:1.5px solid #B9B2A8;border-radius:3px;background:var(--white);color:var(--ink);width:100%}
.enquire textarea{min-height:130px;resize:vertical}
.enquire fieldset{border:0;margin:0;padding:0;display:grid;gap:8px}
.enquire legend{font-size:14px;font-weight:600;margin-bottom:6px;padding:0}
.enquire .opts{display:flex;flex-wrap:wrap;gap:8px}
.enquire .opts label{display:flex;align-items:center;gap:8px;font-weight:500;border:1.5px solid var(--rule);padding:8px 12px;border-radius:3px;cursor:pointer;font-size:15px}
.enquire .opts input{width:auto;margin:0}
.enquire .small{font-size:13px;color:var(--soft);font-weight:400}
@media (max-width:820px){.enquire{grid-template-columns:minmax(0,1fr)}.enquire .row2{grid-template-columns:minmax(0,1fr)}}

/* ===== taste the landscape page ===== */
.t-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:0;padding:0;background:var(--mist)}
.t-hero .txt{padding-block:clamp(44px,7vw,96px);padding-inline:var(--gut);display:flex;flex-direction:column;justify-content:center;gap:18px}
.t-hero h1{font-size:clamp(38px,5vw,62px);line-height:1.05}
.t-hero p{font-size:clamp(17px,1.5vw,19px);color:var(--soft);max-width:32em}
.t-hero .ph{min-height:480px}
@media (max-width:820px){.t-hero{grid-template-columns:minmax(0,1fr)}.t-hero .ph{min-height:280px;order:-1}}
.chain{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.chain li{padding:16px 16px 4px 0;font-size:15px;color:var(--soft);position:relative}
.chain li b{display:block;font-family:var(--display);font-weight:500;font-size:22px;color:var(--ink);margin-bottom:4px}
.chain li:not(:last-child) b::after{content:" →";color:var(--gold)}
@media (max-width:900px){.chain{grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 16px}}
.honest{max-width:820px}
.honest h2{font-size:clamp(28px,3.2vw,38px);margin:10px 0 14px}
.honest p{font-size:19px;line-height:1.72;color:var(--ink)}
.honest p + p{margin-top:12px}
.xp{background:var(--white);border-block:1px solid var(--rule)}
.xp h2{font-size:clamp(30px,3.6vw,44px);margin:10px 0 24px}
.xp-grid{display:grid;grid-template-columns:240px minmax(0,1fr);border:1px solid var(--rule)}
@media (max-width:820px){.xp-grid{grid-template-columns:minmax(0,1fr)}}
.xp-tabs{display:flex;flex-direction:column;background:var(--mist)}
@media (max-width:820px){.xp-tabs{flex-direction:row;overflow-x:auto}}
.xp-tabs button{all:unset;cursor:pointer;padding:16px 20px;display:flex;align-items:center;gap:12px;font-family:var(--display);font-size:21px;color:var(--ink);border-bottom:1px solid var(--rule);white-space:nowrap}
.xp-tabs button i{width:20px;height:20px;border-radius:50%;flex:none;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.xp-tabs button[aria-selected="true"]{background:var(--white);box-shadow:inset 4px 0 0 var(--burg)}
.xp-tabs button:focus-visible{outline:3px solid var(--gold);outline-offset:-3px}
.xp-panel{padding:clamp(22px,3vw,38px);min-width:0}
.xp-panel .bar{height:8px;margin:calc(clamp(22px,3vw,38px) * -1) calc(clamp(22px,3vw,38px) * -1) 24px}
.xp-panel h3{font-size:clamp(30px,3.4vw,40px);margin-bottom:10px}
.xp-panel .line{font-family:var(--display);font-style:italic;font-size:21px;color:var(--burg);margin-bottom:22px;max-width:32em}
.xp-panel dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 32px;margin:0}
@media (max-width:640px){.xp-panel dl{grid-template-columns:minmax(0,1fr)}}
.xp-panel dt{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--olive)}
.xp-panel dt.no{color:var(--terra)}
.xp-panel dd{margin:5px 0 0;font-size:16px;color:var(--ink)}
.xp-panel .music{margin-top:24px;padding-top:18px;border-top:1px solid var(--rule);display:flex;gap:14px;align-items:center;flex-wrap:wrap;font-size:15px;color:var(--soft)}
.xp-panel .music b{font-family:var(--display);font-weight:500;font-size:19px;color:var(--ink)}
.disc{width:34px;height:34px;border-radius:50%;flex:none;background:radial-gradient(circle,var(--mist) 0 3px,#2B2A28 4px 11px,#4a4744 12px 13px,#2B2A28 14px)}
.cmp h2{font-size:clamp(30px,3.6vw,44px);margin:10px 0 10px}
.cmp > p{color:var(--soft);max-width:36em;margin-bottom:24px}
.cmp-pick{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-bottom:22px;font-weight:600}
.cmp-pick select{font:inherit;font-size:16px;padding:10px 12px;border:1.5px solid #B9B2A8;border-radius:3px;background:var(--white);color:var(--ink)}
.cmp-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0;border:1px solid var(--rule);background:var(--white)}
.cmp-cols > div{padding:22px 24px;min-width:0}
.cmp-cols > div + div{border-left:1px solid var(--rule)}
.cmp-cols h3{font-size:28px;margin-bottom:12px;padding-bottom:10px;border-bottom:4px solid var(--soil,#ccc)}
.cmp-cols dt{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--olive);margin-top:14px}
.cmp-cols dd{margin:4px 0 0;font-size:15px}
@media (max-width:640px){.cmp-cols{grid-template-columns:minmax(0,1fr)}.cmp-cols > div + div{border-left:0;border-top:1px solid var(--rule)}}
.twoglass{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:clamp(16px,3vw,40px);align-items:stretch;background:var(--oliveDk);color:var(--onDark)}
.twoglass .head2{grid-column:1 / -1}
.twoglass .head2 .kicker{color:var(--goldLight)}
.twoglass .head2 h2{color:#fff;font-size:clamp(30px,3.6vw,44px);margin:10px 0 10px}
.twoglass .head2 p{color:var(--onDarkSoft);max-width:38em}
.twoglass .g{border:1px solid #56643F;padding:22px 24px}
.twoglass .g b{display:block;font-family:var(--display);font-weight:500;font-size:26px;color:#fff;margin-bottom:6px}
.twoglass .g span{display:block;font-size:15px;color:var(--onDarkSoft)}
.twoglass .vs{display:grid;place-items:center;font-family:var(--display);font-style:italic;font-size:28px;color:var(--goldLight)}
.twoglass .foot{grid-column:1 / -1;font-size:16px;color:var(--onDarkSoft);max-width:40em}
@media (max-width:820px){.twoglass{grid-template-columns:minmax(0,1fr)}.twoglass .vs{padding:4px}}
.soon{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
@media (max-width:820px){.soon{grid-template-columns:minmax(0,1fr)}}
.soon .c{border-top:2px solid var(--terra);padding-top:14px}
.soon .c h3{font-size:22px;margin:6px 0}
.soon .c p{font-size:15px;color:var(--soft)}
/* testimonial (curation) */
.testi{background:#EDE4D3;border-block:1px solid var(--rule)}
.testi .q{max-width:900px;margin:0 auto;position:relative;padding-left:clamp(0px,7vw,96px)}
.testi .q::before{content:"\201C";font-family:var(--display);font-size:clamp(96px,12vw,170px);line-height:.75;color:var(--gold);position:absolute;left:0;top:0}
@media (max-width:640px){.testi .q::before{position:static;display:block;margin-bottom:-18px}}
.testi blockquote{margin:0;font-family:var(--display);font-size:clamp(19px,1.9vw,23px);line-height:1.55;color:var(--ink)}
.testi blockquote p + p{margin-top:.75em}
.testi cite{display:block;margin-top:26px;font:600 14px/1.4 var(--body);letter-spacing:.08em;text-transform:uppercase;color:var(--soft);font-style:normal}
.testi cite b{color:var(--burg);font-weight:700}
.process{background:var(--white)}
/* ===== about ===== */
.a-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:end;padding-block:clamp(40px,6vw,80px) clamp(32px,4vw,56px)}
.a-hero h1{font-size:clamp(38px,5vw,62px);margin:14px 0 0;line-height:1.06}
.a-hero .ph{aspect-ratio:4/3}
@media (max-width:820px){.a-hero{grid-template-columns:minmax(0,1fr)}}
.a-body{display:grid;grid-template-columns:minmax(0,220px) minmax(0,680px);gap:clamp(24px,5vw,72px);padding-top:clamp(24px,4vw,48px)}
.a-body aside{font-size:14px;color:var(--soft);display:grid;gap:22px;align-content:start;position:sticky;top:24px}
.a-body aside b{display:block;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--olive);margin-bottom:4px}
.a-body .prose{font-size:19px;line-height:1.75}
@media (max-width:820px){.a-body{grid-template-columns:minmax(0,1fr)}.a-body aside{position:static;order:2;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}}
.study{list-style:none;margin:0;padding:0;display:grid;border-top:1px solid var(--rule)}
.study li{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:14px;border-bottom:1px solid var(--rule);font-size:17px}
.study li span{color:var(--soft);font-size:15px}
.strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:0}
.strip .ph{aspect-ratio:3/4}

.contact{background:var(--mist);text-align:center;display:grid;justify-items:center;gap:16px}
.contact h2{font-size:clamp(32px,3.6vw,42px)}
.contact p{color:var(--soft);max-width:34em}
.contact .ctas{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
/* v3.1 crops: frames follow the photograph where it matters */
.st-hero.port .ph{aspect-ratio:3/4;max-width:620px;max-height:none;margin-inline:auto}
.st-hero.port .cap{text-align:center;max-width:none}
.fig-natural{margin:1.4em 0 .4em}
.fig-natural .ph{aspect-ratio:auto}
.fig-natural .ph img{height:auto}
.fig-natural.narrow{max-width:400px;margin-inline:auto}
.svc .ph.natural{aspect-ratio:auto;max-height:none}
.svc .ph.natural img{height:auto}
/* v3 additions */
.fn .c{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start}
.fn .c .ph{aspect-ratio:1;width:96px}
.process ol.steps5{grid-template-columns:repeat(5,minmax(0,1fr));gap:0;border-top:1px solid var(--rule)}
.process ol.steps5 li{background:none;border-top:0;border-left:1px solid var(--rule);padding:18px 20px 4px}
.process ol.steps5 li:first-child{border-left:0;padding-left:0}
.process ol.steps5 li::before{font-size:28px;margin-bottom:6px;display:inline-block;margin-right:8px}
.process ol.steps5 li b{display:inline;font-size:16px}
.process ol.steps5 li span{margin-top:6px}
.process ol.steps5.three{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:1000px){.process ol.steps5,.process ol.steps5.three{grid-template-columns:minmax(0,1fr)}.process ol.steps5 li{border-left:0;border-top:1px solid var(--rule);padding:14px 0}.process ol.steps5 li:first-child{border-top:0}}
.yacht .ph{min-height:520px}
@media (max-width:820px){.yacht .ph{min-height:340px;order:-1}}
.bg{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,48px);align-items:start;border-top:1px solid var(--rule)}
.bg .r{border-top:3px solid var(--burg);padding-top:12px;margin-bottom:18px}
.bg .r:nth-of-type(2){border-color:var(--olive)}.bg .r:nth-of-type(3){border-color:#2F6E8A}
.bg .r h3{font-size:24px}
.bg .r p{font-size:15px;color:var(--soft);margin-top:2px}
.bg ul{list-style:none;margin:10px 0 0;padding:0;border-top:1px solid var(--rule)}
.bg li{padding-block:10px;border-bottom:1px solid var(--rule);font-size:15px;display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.bg li span{color:var(--soft);font-size:14px}
.bg .ph{aspect-ratio:4/3}
@media (max-width:820px){.bg{grid-template-columns:minmax(0,1fr)}}
.portrait-needed{background:var(--mist);border:1px dashed #C9BFAE;aspect-ratio:4/3;display:grid;place-items:center;text-align:center;padding:24px;color:var(--soft);font-size:15px}
.portrait-needed b{display:block;font-family:var(--display);font-weight:500;font-size:24px;color:var(--burg);margin-bottom:6px}
@media (max-width:820px){.strip{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.strip .ph:first-child{grid-column:1 / -1;aspect-ratio:16/10}.strip .ph:last-child{display:block}}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

/* ===================== WordPress build additions ===================== */
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;word-wrap:normal!important}
.skip-link:focus{clip:auto;clip-path:none;height:auto;width:auto;position:fixed;left:12px;top:12px;z-index:200;background:var(--white);padding:10px 14px;border:2px solid var(--burg);color:var(--ink)}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}

/* header + menus */
.menu a.btn{color:#fff;border-bottom:2px solid var(--burg)}
.burger{background:none;border:0;padding:8px 4px;cursor:pointer}
.mobile-menu{position:fixed;inset:0;z-index:100;background:var(--paper);display:flex;flex-direction:column;padding-block:calc(env(safe-area-inset-top,0px) + 16px) 32px;padding-inline:var(--gut);overflow:auto}
.mobile-menu[hidden]{display:none}
.mobile-menu .mm-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}
.mobile-menu .mm-close{background:none;border:0;font-size:40px;line-height:1;color:var(--ink);cursor:pointer;padding:4px 8px}
.mobile-menu nav{display:grid;gap:4px}
.mobile-menu nav a{font-family:var(--display);font-size:32px;text-decoration:none;color:var(--ink);padding:10px 0;border-bottom:1px solid var(--rule)}
.mobile-menu nav a.cur-link{color:var(--burg);padding-left:0;border-left:0}
.mobile-menu nav a.cur-link::after{display:none}
.mobile-menu nav a.btn{font-family:var(--body);font-size:18px;text-align:center;margin-top:18px;border-bottom:2px solid var(--burg);color:#fff}
.mobile-menu nav a[aria-current="page"]{color:var(--burg)}

/* field notes as links */
.fn a.c{text-decoration:none;color:inherit}
.fn a.c:hover h3{color:var(--burg)}
.card:hover h3{color:var(--burg)}

/* forms */
.nl-form{display:block}
.sub form.nl-form{display:block}
.nl-row{display:flex;gap:12px;flex-wrap:wrap}
.nl-row input{flex:1 1 220px;min-width:0;font:inherit;font-size:16px;padding:14px 16px;border:1.5px solid #B9B2A8;border-radius:3px;background:var(--white);color:var(--ink)}
.consent{display:flex!important;gap:10px;align-items:flex-start;font-size:14px;font-weight:400;color:var(--soft);margin-top:12px;position:static!important;left:auto!important;line-height:1.5}
.consent input{width:auto!important;margin-top:4px;flex:none}
.consent a{color:var(--burg)}
.form-msg{margin-top:12px;font-size:15px;font-weight:600;padding:10px 14px;border-radius:3px}
.form-msg.ok{background:#E3EBD5;color:var(--oliveDk)}
.form-msg.err{background:#F6DCD6;color:#7A1F1A}
.st-sub .inner .nl-form{flex:1 1 340px}
.enquire form .consent{margin-top:0}

/* journal */
.j-head{padding-block:clamp(40px,6vw,80px) clamp(24px,3vw,40px)}
.j-head h1{font-size:clamp(38px,5vw,60px);margin:12px 0 14px}
.j-head .lede{font-size:clamp(17px,1.6vw,20px);color:var(--soft);max-width:36em}
.filters{display:grid;gap:12px;margin-top:26px}
.f-group{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.f-group > span{font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--olive);min-width:96px}
.chip{display:inline-block;font-size:14px;font-weight:600;padding:6px 12px;border:1.5px solid var(--rule);border-radius:99px;text-decoration:none;color:var(--ink);background:var(--white)}
.chip:hover,.chip.on{border-color:var(--burg);color:var(--burg)}
.pager{margin-top:40px}
.pager .nav-links{display:flex;gap:10px;flex-wrap:wrap}
.pager a,.pager span{padding:8px 12px;border:1px solid var(--rule);text-decoration:none}

/* story body (content from the editor) */
.entry > *{margin:0}
.entry figure{margin:1.4em 0 .4em}
.entry img{height:auto;max-width:100%}
.entry figcaption,.entry .wp-element-caption{font-size:13px;color:var(--soft);margin-top:8px}
.entry blockquote{margin:1em 0;padding-left:20px;border-left:2px solid var(--gold);font-family:var(--display);font-size:22px;line-height:1.45}
.entry a{color:var(--burg)}
.author .author-img{width:64px;height:64px;border-radius:50%;object-fit:cover}
.a-music{display:grid;grid-template-columns:56px 1fr;gap:18px;align-items:center;background:var(--mist);padding:22px 24px;margin-top:20px}
.a-music .disc{width:56px;height:56px;border-radius:50%;background:radial-gradient(circle,#F5F3EC 0 5px,#2B2A28 6px 18px,#4a4744 19px 20px,#2B2A28 21px)}
.a-music small{display:block;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--olive)}
.a-music b{display:block;font-family:var(--display);font-weight:500;font-size:22px}

/* footer */
footer.site-foot .cols div a,footer.site-foot .cols div span{display:block}

/* earth to glass */
.e-hero{background:var(--burg);color:var(--onDark)}
.e-hero .kicker{color:var(--goldLight)}
.e-hero h1{color:#fff}
.e-hero p{color:var(--onDarkSoft)}
.e-hero .sub-title{font-family:var(--display);font-size:22px;color:var(--goldLight);margin-top:-6px}
.e-hero .btn{background:var(--goldLight);border-color:var(--goldLight);color:#3A1016}
.chain.chain5{grid-template-columns:repeat(5,minmax(0,1fr))}
@media (max-width:900px){.chain.chain5{grid-template-columns:repeat(2,minmax(0,1fr))}}
.parts-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
@media (max-width:820px){.parts-grid{grid-template-columns:minmax(0,1fr)}}
.part-card{border-top:2px solid var(--burg);padding-top:14px}
.part-card .n{font-family:var(--display);font-size:30px;color:var(--gold)}
.part-card h3{font-size:24px;margin:4px 0 6px}
.part-card p{font-family:var(--display);font-style:italic;color:var(--soft);font-size:17px}
.agents{grid-template-columns:minmax(0,1fr)}

.entry .is-narrow{max-width:400px;margin-inline:auto}

/* Photos fill their frame (WordPress adds width/height attributes, so percentage heights alone don't work). */
.ph{position:relative}
.ph:not(.natural) > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fig-natural .ph > img,.ph.natural > img{position:static;height:auto}
.agents .btn{background:var(--goldLight);border-color:var(--goldLight);color:#1f2914}

.e-hero .status-line{font-size:15px;color:var(--goldLight);border-left:2px solid var(--goldLight);padding-left:12px;max-width:30em}

/* ===== Story features: "At the table", recipe, sources ===== */
.entry .wp-block-group{display:grid;gap:1em}
.entry h3{font-size:24px;margin-top:.4em}
.entry .at-table{margin-top:2.4em;padding-top:2em;border-top:2px solid var(--gold);gap:1.2em}
.entry .at-table > h2{font-size:clamp(28px,3.4vw,36px);margin-top:0}
.entry .wine-card{background:var(--white);border:1px solid var(--rule);border-left:4px solid var(--olive);padding:22px 24px;gap:.8em}
.entry .wine-card h3,.entry .recipe-card h3,.entry .pairing h3{font-size:12px;font-family:var(--body);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--olive);margin:0}
.entry .recipe-card h3{font-family:var(--display);font-size:clamp(26px,3vw,32px);letter-spacing:0;text-transform:none;color:var(--ink);font-weight:500}
.entry .wine-card .wine-name{font-family:var(--display);font-size:24px;line-height:1.25;color:var(--ink)}
.entry .wine-card p{font-size:17px}
.entry .wine-card .serve{font-size:15px;font-weight:600;color:var(--olive);border-top:1px solid var(--rule);padding-top:12px}
.entry .recipe-card{background:var(--mist);padding:26px clamp(18px,3vw,30px) 22px;gap:.6em}
.entry .recipe-card .serves{font-size:15px;color:var(--soft);margin-top:-6px}
.entry .recipe-card h4{font:700 12px/1.4 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--golddk);margin-top:1em}
.entry .ingredients{list-style:none;margin:0;padding:0;columns:2 220px;column-gap:28px}
.entry .ingredients li{break-inside:avoid;padding:9px 0;border-bottom:1px solid #E1D8C6;font-size:17px}
.entry .method{list-style:none;margin:0;padding:0;counter-reset:m;display:grid;gap:14px}
.entry .method li{counter-increment:m;position:relative;padding-left:46px;font-size:17px;line-height:1.6}
.entry .method li::before{content:counter(m);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--burg);color:#fff;font:600 14px/30px var(--body);text-align:center}
.entry .recipe-note{font-size:15px;color:var(--soft);font-style:italic;border-top:1px solid #E1D8C6;padding-top:14px;margin-top:.6em}
.entry .pairing{gap:.5em}
.entry .coda{font-family:var(--display);font-style:italic;font-size:clamp(24px,2.6vw,30px);line-height:1.45;color:var(--burg);border-block:1px solid var(--gold);padding-block:20px;margin-top:.8em;text-align:center}
.entry .sources{margin-top:2.6em;padding-top:1.2em;border-top:1px solid var(--rule);gap:.4em}
.entry .sources h3{font:700 12px/1.4 var(--body);letter-spacing:.2em;text-transform:uppercase;color:var(--soft);margin:0}
.entry .sources ul{margin:0;padding-left:18px;font-size:14px;line-height:1.6;color:var(--soft);display:grid;gap:6px}
.entry .sources a{color:var(--soft);text-decoration-color:var(--gold)}
.entry figure figcaption a,.st-hero .cap a{color:inherit}
/* Classic themes wrap group content in an inner container: give it the grid spacing. */
.entry .wp-block-group > .wp-block-group__inner-container{display:grid;gap:1em}
.entry .at-table > .wp-block-group__inner-container{gap:1.6em}
.entry .wine-card > .wp-block-group__inner-container{gap:.7em}
.entry .recipe-card > .wp-block-group__inner-container{gap:.7em}
.entry .pairing > .wp-block-group__inner-container{gap:.6em}
.entry .recipe-card .serves{margin-top:0}

/* ---------- Print: a clean, readable copy of a story (and a printable recipe) ---------- */
@media print{
  @page{size:A4;margin:14mm 18mm 14mm}
  :root{--gut:0px}
  html,body{width:auto;min-width:0;overflow:visible;background:#fff}
  *{box-sizing:border-box}
  .skip-link,.nav .menu,.burger,.mobile-menu,.site-foot,.st-sub,main > section,.facts,.a-music,.author{display:none !important}
  .nav{border:0;padding:0 0 4mm;justify-content:center;background:#fff}
  .st-head,.st-hero,.st-body{max-width:none;width:auto;padding-inline:0 !important;margin-inline:0}
  .st-head{padding-top:2mm}
  .st-hero .ph{max-height:110mm}
  .st-body{padding-top:6mm}
  .st-body{max-width:150mm !important;margin-inline:auto !important}
  .st-body .prose{font-size:12pt;line-height:1.6}
  .entry .pairing{break-inside:avoid}
  img{max-width:100%}
  /* Grid layouts do not split across printed pages; use ordinary block flow instead */
  .prose,.prose .wp-block-group,.prose .wp-block-group__inner-container,.entry .method,.entry .sources ul{display:block !important}
  .prose > * + *,.prose .wp-block-group__inner-container > * + *{margin-top:.9em}
  .entry .method li{min-height:30px}
  .entry .method li + li{margin-top:10px}
  .entry .ingredients li,.entry .method li,.entry .wine-card p{font-size:10.5pt}
  .entry .sources ul{font-size:9pt}
  .entry .sources li + li{margin-top:3px}
  h1,h2,h3,h4,.kicker,.wine-name,.serves{break-after:avoid;break-inside:avoid}
  .entry .at-table{break-before:page;border-top:0;margin-top:0;padding-top:0}
  .entry .recipe-card{break-before:page}
  .entry .ingredients{break-inside:avoid}
  p,li{orphans:3;widows:3}
  .ph,.wp-block-image,figure,.wine-card,.coda,.author,.method li,.ingredients li{break-inside:avoid}
  a{color:inherit}
}

/* Portrait photographs inside a story: narrower and centred, so they don't fill a whole screen */
.entry .wp-block-image.is-portrait{max-width:min(420px,100%);margin-inline:auto}
@media print{ .entry .wp-block-image.is-portrait{max-width:85mm} }
/* Story photographs sized by role: a featured documentary photo, and a small detail (a certificate, a label) */
.entry .wp-block-image.is-feature{max-width:min(560px,100%);margin-inline:auto}
.entry .wp-block-image.is-detail{max-width:min(340px,100%);margin-inline:auto}
@media print{ .entry .wp-block-image.is-feature{max-width:110mm} .entry .wp-block-image.is-detail{max-width:70mm} }
/* Print: never leave a section heading stranded at the foot of a page.
   The invisible block under each heading reserves about eight lines; if they don't fit, the heading moves to the next page with its text. */
@media print{
  .prose h2,.prose h3{break-inside:avoid;break-after:avoid}
  .prose h2::after,.prose h3::after{content:"";display:block;height:50mm;margin-bottom:-50mm}
}