/* Shared surfaces follow the homepage Verified Trade Passport. */
:root{--card-radius:14px;--card-shadow:0 12px 32px #153f3109;--card-pad:32px}
.audience-layout,.field-grid,.questions-grid,.contact-layout,.story-stage{
  border:1px solid var(--line);border-radius:var(--card-radius);background:var(--cream);
  box-shadow:var(--card-shadow);gap:0;align-items:stretch;
  grid-template-columns:minmax(0,1fr) minmax(0,1.2fr)
}
.audience-layout>*,.field-grid>*,.questions-grid>*,.contact-layout>*,.story-stage>*{min-width:0}
.audience-layout>div:first-child,.field-copy,.questions-grid>div:first-child,.contact-layout>div:first-child,.story-copy{padding:var(--card-pad)}
.audience-layout>div:last-child,.questions-grid>.faq{padding:var(--card-pad);background:white;border-left:1px solid var(--line);border-radius:0 var(--card-radius) var(--card-radius) 0}
.audience-layout h2,.questions-grid h2,.contact-layout h2{font-size:clamp(1.8rem,3vw,2.7rem);max-width:16ch}
.audience-answer h3{font-size:1.5rem}.audience-answer{margin:24px 0}
.process-grid{gap:22px;margin-top:32px}
.process-grid>a{padding:28px;background:white;border:1px solid var(--line);border-radius:var(--card-radius);box-shadow:var(--card-shadow);transition:border-color .2s,box-shadow .2s}
.process-grid>a:hover{border-color:#8da383;box-shadow:0 16px 36px #153f3112}
.process-number{margin:-28px -28px 24px;padding:18px 28px;background:var(--cream);border-bottom:1px solid var(--line);border-radius:13px 13px 0 0;font-weight:700;color:var(--green)}
.process-link{margin-top:auto;padding-top:24px}.process-grid p{padding-bottom:24px}
.field-grid{align-items:stretch}.field-copy h2{font-size:clamp(1.8rem,3vw,2.7rem)}
.field-grid>.event-photo{border-radius:0 13px 13px 0;border-left:1px solid var(--line);display:flex;flex-direction:column;background:white}
.event-photo img{flex:1;min-height:0;height:420px;max-height:520px;background:#edf0e7}
.event-photo figcaption{padding:24px 28px;border-top:1px solid var(--line);background:white}
.watch{border:1px solid var(--line);border-radius:var(--card-radius);background:var(--cream);padding:0 28px;margin-top:24px;box-shadow:var(--card-shadow)}
.watch summary{padding:20px 0}
.faq details:first-child summary{padding-top:4px}.faq details:last-child{border-bottom:0}.faq details:last-child p{padding-bottom:0}
.contact-section{background:#edf0e4}
.contact-layout>.contact-form{border:0;border-left:1px solid var(--line);border-radius:0 13px 13px 0;overflow:visible}
.contact-form>summary{padding:32px}.enquiry-form{padding:0 32px 32px}
.story-stage{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
.story-stage>.story-evidence{padding:var(--card-pad);border:0;border-left:1px solid var(--line);border-radius:0 13px 13px 0;background:white}
.story-copy{align-self:center}.story-copy h3{min-height:0}
.story-controls button{border:1px solid var(--line);border-radius:8px;padding:16px;background:var(--cream)}
.story-controls button[aria-pressed=true]{background:#e9eddf;border-color:var(--forest)}
.passport-copy,.passport-annotation{border:1px solid var(--line);border-radius:var(--card-radius);padding:28px;background:var(--cream);box-shadow:var(--card-shadow)}
.passport-picture{border-radius:var(--card-radius)}.passport-picture img{border-radius:13px}
.visual-explainer,.journey-stage,.evidence-trail,.verification-details,.passport-shell,.stage-passport,.selector{border-radius:var(--card-radius);border-color:var(--line);box-shadow:var(--card-shadow)}
.passport-head,.stage-passport-head,.dialog-top{background:var(--cream);color:var(--ink);border-bottom:1px solid var(--line)}
.passport-head p,.stage-passport-head p{color:var(--muted)}.stage-passport-head>span{color:var(--green)}
.passport-head .badge{border-color:#a9b89e;color:var(--muted);white-space:normal}
.passport-shell .panel{background:var(--cream)}.passport-shell .data-grid>div{background:white;border-radius:8px}
.passport-shell .context-box,.print-card,.record-output,.trail-result{border-radius:10px}
.passport-shell .tabs{background:white}.passport-shell .document-view{border-radius:8px}
@media(max-width:900px){:root{--card-pad:26px}.process-grid{gap:16px}.process-grid>a{padding:22px}.process-number{margin:-22px -22px 22px;padding:16px 22px}.contact-form>summary{padding:26px}.enquiry-form{padding:0 26px 26px}}
@media(max-width:760px){
  .audience-layout,.field-grid,.questions-grid,.contact-layout,.story-stage{grid-template-columns:minmax(0,1fr);gap:0}
  .audience-layout>div:last-child,.questions-grid>.faq,.field-grid>.event-photo,.contact-layout>.contact-form,.story-stage>.story-evidence{border-left:0;border-top:1px solid var(--line);border-radius:0 0 13px 13px}
  .audience-layout h2,.questions-grid h2,.contact-layout h2{max-width:24ch}
  .event-photo img{flex:none;height:400px;max-height:none}.story-controls button{padding:12px 8px}
}
@media(max-width:540px){
  :root{--card-pad:22px}.process-grid{gap:20px}.event-photo img{height:350px}
  .event-photo figcaption,.passport-copy,.passport-annotation{padding:22px}.watch{padding:0 22px}
  .contact-form>summary{padding:22px}.enquiry-form{padding:0 22px 22px}.story-evidence .evidence-top{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.process-grid>a{transition:none}}
/* Visible photo navigation for the expanded events gallery. */
.event-thumbnails{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:24px;background:var(--cream);border-top:1px solid var(--line);border-radius:0 0 13px 13px}
.event-thumbnails button{min-width:0;padding:5px;background:white;border:2px solid transparent;border-radius:9px;color:var(--forest);text-align:left}
.event-thumbnails button[aria-pressed=true]{border-color:var(--forest);background:#e9eddf}
.event-thumbnails button:hover{border-color:#8da383}
.event-thumbnails img{display:block;width:100%;height:120px;object-fit:cover;object-position:center 42%;border-radius:5px}
.event-thumbnails span{display:block;padding:9px 5px;font-size:.875rem;line-height:1.35;font-weight:700}
.field-grid:has(.event-thumbnails)>.event-photo{border-radius:0 13px 0 0}
@media(max-width:760px){.event-thumbnails{grid-template-columns:repeat(3,minmax(0,1fr));padding:20px;gap:10px}.field-grid:has(.event-thumbnails)>.event-photo{border-radius:0}}
@media(max-width:540px){.event-thumbnails{grid-template-columns:repeat(2,minmax(0,1fr))}.event-thumbnails img{height:125px}}
