/* About, Stories, Contact and 404 in the Warm Editorial design (brk.css tokens).
   These pages keep their earlier markup (templates/<lang>/page-*.html); this file gives it
   the same look as the homepage, so every page shares one header, type and set of cards. */

/* Page hero: text on paper, no photo banner */
.inner-hero{padding:clamp(48px,8vw,96px) max(var(--gutter),calc((100% - var(--wrap)) / 2 + var(--gutter))) clamp(32px,5vw,56px)}
.inner-hero-photo{display:none}
.inner-hero-copy{max-width:760px;display:grid;gap:var(--s4);justify-items:start}
.inner-hero h1{font:400 var(--h1)/1.04 var(--serif);color:var(--ink);margin:0;letter-spacing:-.01em}
.inner-hero p{font-size:var(--lead);line-height:1.55;color:var(--ink-soft);margin:0;max-width:640px}
.badge{font:700 var(--label)/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--leaf)}

/* Buttons from the earlier design */
.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--s3);min-height:52px;padding:0 var(--s5);border-radius:var(--r-pill);background:var(--accent);color:var(--white);font:600 var(--small)/1 var(--sans);text-decoration:none;border:1.5px solid var(--accent);transition:background .2s}
.button:hover{background:var(--accent-deep);border-color:var(--accent-deep)}
.button>span{display:none}
.button.outline,.depth-outline{background:transparent;color:var(--ink);border-color:var(--ink)}
.button.outline:hover,.depth-outline:hover{background:var(--mist)}
.quiet-link{color:var(--accent);font-weight:600;text-underline-offset:4px}
.contact-hero-actions{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center}

/* Sections: same width, rhythm and headings as the homepage */
main>.section:not(.hero):not([class*=wrap]){max-width:var(--wrap);margin:0 auto;padding:clamp(56px,7vw,96px) var(--gutter);box-sizing:border-box}
main>.inner-hero+.section{padding-top:var(--s6)}
.section-heading{display:grid;gap:var(--s5);margin-bottom:var(--s7)}
@media(min-width:960px){.section-heading{grid-template-columns:1fr auto;align-items:end}}
main>.section h2{font:400 var(--h2)/1.05 var(--serif);color:var(--ink);margin:var(--s3) 0 var(--s5)}
main>.section h3{font:400 var(--h3)/1.2 var(--serif);color:var(--ink);margin:0 0 var(--s3)}
main>.section p{line-height:1.6}
.image-note,.scope-note{font-size:15px;color:var(--ink-soft)}

/* About */
.about-intro{display:grid;gap:var(--s5)}
.about-copy{display:grid;gap:var(--s4);max-width:720px;font-size:var(--body);color:var(--ink-soft)}
.gallery-controls{display:none}
.swiper-wrapper{display:grid;gap:var(--s5)}
@media(min-width:800px){.swiper-wrapper{grid-template-columns:repeat(3,1fr)}}
.approach-slide{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.approach-slide img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.approach-slide>div{padding:var(--s5)}
.expectation-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s5)}
@media(min-width:800px){.expectation-list{grid-template-columns:repeat(3,1fr)}}
.expectation-list li{display:grid;gap:var(--s3);padding-top:var(--s4);border-top:2px solid var(--accent)}
.expectation-list li>span,.preparation-list span{font:500 32px/1 var(--serif);color:var(--accent)}

/* Closing call to action on each page */
main>.section.contact-panel{background:var(--mist);border-radius:var(--r-md);max-width:calc(var(--wrap) - 2 * var(--gutter));margin:0 auto var(--s8);padding:clamp(32px,6vw,64px);display:grid;gap:var(--s4);justify-items:start;text-align:left}
.contact-panel h2{margin:0}

/* Contact */
.contact-details{display:grid;gap:var(--s7)}
@media(min-width:960px){.contact-details{grid-template-columns:1fr 1fr;align-items:start}}
.contact-photo{margin:var(--s5) 0 0}
.contact-photo img{width:100%;height:auto;border-radius:var(--r-md);display:block}
.contact-photo figcaption{font-size:14px;color:var(--ink-soft);margin-top:var(--s2)}
.contact-options{display:grid;gap:var(--s4)}
.contact-options article{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s5)}
.contact-action-row{display:flex;flex-wrap:wrap;gap:var(--s3);align-items:center;margin-top:var(--s4)}
.contact-number{font:500 26px/1.2 var(--serif);color:var(--ink);text-decoration:none}
.contact-number:hover{color:var(--accent)}
.preparation-section{display:grid;gap:var(--s6)}
@media(min-width:960px){.preparation-section{grid-template-columns:1fr 1.2fr;align-items:start}}
.preparation-list{display:grid;gap:var(--s4)}
.preparation-list p{display:grid;grid-template-columns:48px 1fr;gap:var(--s3);align-items:baseline;margin:0;padding-bottom:var(--s4);border-bottom:1px solid var(--line);font-size:var(--body)}

/* Stories and Winners */
.stories-state{display:grid;grid-template-columns:auto 1fr;gap:var(--s3) var(--s5);align-items:start;background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s5);margin-top:var(--s5)}
.quote-mark{font:400 56px/1 var(--serif);color:var(--sun)}
.status-label{grid-column:2;justify-self:start;padding:6px 14px;border-radius:var(--r-pill);background:var(--mist);font:600 14px/1.2 var(--sans);color:var(--ink-soft)}
.story-invitation{display:grid;gap:var(--s4);justify-items:start;margin-top:var(--s5);padding:var(--s5);border-radius:var(--r-md);background:var(--paper);border:1px dashed var(--line)}
@media(min-width:800px){.story-invitation{grid-template-columns:1fr auto;align-items:center}}