:root {
  --bark: #4c1d10;
  --gold: #d3a85e;
  --parchment: #dbcfa4;
  --ember: #671c02;
  --earth: #3e2f17;
  --amber: #d07629;
  --cream: #f5efe2;
  --smoke: #2a1a0e;
  --warm-mid: #7a3a18;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body { background-color:var(--cream); color:var(--earth); font-family:'Crimson Pro',Georgia,serif; font-size:19px; line-height:1.75; overflow-x:hidden; }

body::before { content:''; position:fixed; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 512 512' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E"); opacity:0.04; pointer-events:none; z-index:9999; }

/* NAV */
.site-nav { position:fixed; top:0; left:0; right:0; z-index:100; display:flex; align-items:center; padding:22px clamp(20px,4vw,52px); transition:background 0.4s ease,padding 0.4s ease; gap:32px; }
.site-nav.scrolled { background:rgba(248,242,230,0.95); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:0 1px 0 rgba(62,47,23,0.1); padding-top:13px; padding-bottom:13px; }
.site-nav-logo { display:flex; align-items:center; flex-shrink:0; }
.site-nav-logo img { display:block; width:auto; height:52px; }
.site-nav-links { display:flex; align-items:center; gap:clamp(16px,2.5vw,38px); margin-left:auto; list-style:none; padding:0; }
.site-nav-links li a { font-family:'Crimson Pro',Georgia,serif; font-size:18px; font-weight:800; letter-spacing:0.12em; text-transform:uppercase; text-decoration:none; color:var(--cream); transition:color 0.25s; white-space:nowrap; }
.site-nav.scrolled .site-nav-links li a { color:var(--bark); }
.site-nav-links li a:hover { color:var(--gold); }
.site-nav.scrolled .site-nav-links li a:hover { color:var(--amber); }
.site-nav-burger { display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px; background:none; border:none; cursor:pointer; padding:6px; margin-left:auto; }
.site-nav-burger span { display:block; width:24px; height:1px; background:var(--cream); transition:background 0.3s; }
.site-nav.scrolled .site-nav-burger span { background:var(--bark); }

@media (max-width:960px) {
.site-nav-links { display:none; }
.site-nav-burger { display:flex; }
}

@media (max-width:860px) {
.site-nav { padding:14px 20px; }
.site-nav-logo img { height:46px; }
.site-nav-burger { display:flex; margin-left:auto; }
}

/* HEADER */
.page-header { text-align:center; padding:1rem 2rem; border-bottom:1px solid rgba(76,29,16,0.15); margin-top:72px; }
.header-eyebrow { font-family:'Crimson Pro',serif; font-size:0.72rem; letter-spacing:0.24em; text-transform:uppercase; color:var(--amber); }

/* HERO */
.hero-photo-wrap { position:relative; width:100%; height:clamp(520px,100vh,100vh); overflow:hidden; }
.hero-photo-wrap img { width:100%; height:100%; object-fit:cover; object-position:center 20%; display:block; }
.hero-overlay { position:absolute; inset:0; background:linear-gradient(to bottom,rgba(76,29,16,0.18) 0%,rgba(62,47,23,0.35) 40%,rgba(42,26,14,0.72) 100%); mix-blend-mode:multiply; }
.hero-overlay-color { position:absolute; inset:0; background:rgba(103,28,2,0.22); mix-blend-mode:multiply; }
.hero-credentials { position:absolute; bottom:2rem; left:0; right:0; text-align:center; font-family:'Crimson Pro',serif; font-size:0.72rem; letter-spacing:0.24em; text-transform:uppercase; color:var(--parchment); opacity:0.75; z-index:2; }
.hero-text { position:absolute; top:50%; transform:translateY(-50%); left:0; right:0; padding:clamp(2.5rem,6vw,5rem) clamp(1.5rem,5vw,5rem); text-align:left; z-index:2; }
.hero-text blockquote { font-family:'Instrument Serif',Georgia,serif; font-style:italic; font-size:clamp(1.5rem,3.5vw,2.6rem); color:var(--parchment); line-height:1.3; max-width:700px; margin:0; text-shadow:0 2px 20px rgba(0,0,0,0.4); }
.hero-text blockquote em { color:var(--gold); font-style:normal; }

/* SHARED */
.section-label { font-family:'Crimson Pro',serif; font-size:14px; letter-spacing:0.28em; text-transform:uppercase; color:var(--amber); margin-bottom:1.4rem; display:block; }
.pull-quote { font-family:'IM Fell English',Georgia,serif; font-style:italic; font-size:clamp(1.2rem,2.2vw,1.6rem); color:var(--bark); line-height:1.4; border-left:3px solid var(--gold); padding:0.8rem 0 0.8rem 1.6rem; margin:2rem 0; }
.story-headline { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.8rem,4vw,3rem); color:var(--bark); line-height:1.15; margin-bottom:2rem; font-weight:400; }
.story-headline em { color:var(--ember); font-style:italic; }
.htma-found-heading { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.5rem,2.8vw,2rem); color:var(--gold); font-weight:400; margin-bottom:1.2rem; line-height:1.2; }

/* STORY SECTION */
.story-section { padding:5rem 0; }

/* BLOCK 1 */
.block-1 { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; max-width:1160px; margin:0 auto; padding:0 3rem 5rem; }
.block-1 .story-left p { margin-bottom:1.4rem; color:var(--earth); line-height:1.8; }
.block-1 .story-left p:last-child { margin-bottom:0; }
.frame-single { width:100%; aspect-ratio:3 / 4; background:var(--parchment); border:2px solid rgba(211,168,94,0.45); border-radius:999px 999px 0 0; }

/* BLOCK 2 */
.block-2 { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; max-width:1160px; margin:0 auto; padding:0 3rem 5rem; }
.block-2 .story-left { position:relative; height:clamp(360px,43vw,520px); }
.frame-back { position:absolute; top:clamp(-70px,-6vw,-30px); left:clamp(-80px,-7vw,-30px); width:72%; aspect-ratio:3 / 4; background:var(--parchment); border:2px solid rgba(211,168,94,0.45); border-radius:999px 999px 0 0; z-index:1; }
.frame-front { position:absolute; bottom:clamp(-10px,-1vw,0px); right:clamp(-40px,-3.5vw,-15px); width:62%; aspect-ratio:3 / 4; background:var(--parchment); border:2px solid rgba(211,168,94,0.6); border-radius:999px 999px 0 0; z-index:2; }
.frame-single,.frame-back,.frame-front { overflow:hidden; }
.frame-single img,.frame-back img,.frame-front img { width:100%; height:100%; object-fit:cover; display:block; }
.block-2 .story-right p { margin-bottom:1.4rem; color:var(--earth); line-height:1.8; }
.block-2 .story-right p:last-child { margin-bottom:0; }

/* BLOCK 3 */
.block-3 { background:var(--ember); padding:4rem 3rem; text-align:center; }
.block-3 p { font-family:'IM Fell English',Georgia,serif; font-style:italic; font-size:clamp(1.2rem,2.5vw,1.7rem); color:var(--parchment); line-height:1.55; max-width:720px; margin:0 auto; }

/* BLOCK 4 */
.block-4 { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:start; max-width:1160px; margin:0 auto; padding:5rem 3rem 0; }
.block-4 .story-left { background:var(--ember); padding:2.5rem; border-radius:2px; }
.block-4 .story-left p { margin-bottom:1.4rem; color:var(--parchment); opacity:0.88; line-height:1.8; }
.block-4 .story-left p:last-child { margin-bottom:0; }
.block-4 .story-right p { margin-bottom:1.4rem; color:var(--earth); line-height:1.8; }
.block-4 .story-right p:last-child { margin-bottom:0; }
.block-4 .story-right strong { color:var(--bark); font-weight:600; }

/* PAGE WRAP */
.page-wrap { max-width:780px; margin:0 auto; padding:0 2rem; }

/* PROSE */
.prose p { margin-bottom:1.5rem; color:var(--earth); max-width:62ch; }
.prose p:last-child { margin-bottom:0; }

/* ARCHES */
.arch-section { position:relative; padding:5.5rem 2rem 5rem; background-image:linear-gradient(rgba(76,29,16,0.78),rgba(76,29,16,0.78)),url("images/howworks.png"); background-size:cover; background-position:center; background-repeat:no-repeat; }
.arch-section-inner { max-width:1040px; margin:0 auto; position:relative; z-index:1; }
.arch-section .section-label { color:var(--parchment); opacity:0.5; text-align:center; }
.arch-headline { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.6rem,3vw,2.4rem); color:var(--parchment); font-weight:400; text-align:center; margin-bottom:0.5rem; }
.arch-intro { text-align:center; color:var(--parchment); opacity:0.65; font-style:italic; margin-bottom:4rem; }
.arch-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:2rem; align-items:start; }
.arch-card { display:flex; flex-direction:column; align-items:center; }
.arch-shape { width:220px; min-height:340px; border-radius:110px 110px 0 0; display:flex; flex-direction:column; align-items:center; justify-content:flex-start; padding:2.2rem 1.4rem 2rem; position:relative; overflow:hidden; text-align:center; }
.arch-card:nth-child(1) .arch-shape { background:var(--ember); }
.arch-card:nth-child(2) .arch-shape { background:var(--warm-mid); }
.arch-card:nth-child(3) .arch-shape { background:rgba(211,168,94,0.22); border:1px solid rgba(211,168,94,0.4); }
.arch-order { font-family:'Crimson Pro',serif; font-size:0.65rem; letter-spacing:0.22em; text-transform:uppercase; color:var(--parchment); opacity:0.6; margin-bottom:0.5rem; }
.arch-word { font-family:'IM Fell English',Georgia,serif; font-size:2.4rem; color:var(--parchment); font-weight:400; line-height:1; margin-bottom:1.2rem; }
.arch-card:nth-child(3) .arch-word { color:var(--gold); }
.arch-shape-body { color:var(--parchment); opacity:0.82; font-size:0.9rem; line-height:1.65; text-align:center; }

/* ACCORDION */
.accordion-section { border-bottom:1px solid rgba(76,29,16,0.12); }
.accordion-section:last-of-type { border-bottom:none; }
details { cursor:pointer; }
details summary { list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:2.2rem 0; }
details summary::-webkit-details-marker { display:none; }
.summary-title { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.3rem,2.5vw,1.9rem); color:var(--bark); font-weight:400; line-height:1.2; }
.summary-icon { width:34px; height:34px; border-radius:50%; background:var(--gold); color:var(--bark); display:flex; align-items:center; justify-content:center; font-size:1.2rem; flex-shrink:0; transition:transform 0.3s ease,background 0.2s; font-family:'Crimson Pro',serif; font-weight:300; }
details[open] .summary-icon { transform:rotate(45deg); background:var(--ember); color:var(--parchment); }
.accordion-body { padding-bottom:2.5rem; animation:fadeIn 0.35s ease; }

.body-box { background:var(--parchment); padding:2rem 2.2rem; margin:0.5rem 0; border-radius:1px; }
.body-box p { margin:0!important; }

@keyframes fadeIn { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } }

/* ACC BLOCKS */
.acc-block { background:var(--parchment); padding:2rem 2.2rem; margin:1.5rem 0; border-radius:1px; }
.acc-block-dark { background:var(--bark); padding:2rem 2.2rem; margin:1.5rem 0; }
.acc-block-dark p { color:var(--parchment)!important; opacity:0.88; }
.acc-block-amber { background:var(--amber); padding:1.5rem 2.2rem; margin:1.5rem 0; }
.acc-block-label { font-family:'Crimson Pro',serif; font-size:14px; letter-spacing:0.22em; text-transform:uppercase; color:var(--amber); display:block; margin-bottom:0.8rem; }
.acc-block .acc-block-label { color:var(--ember); }
.acc-block-dark .acc-block-label { color:var(--gold); }
.who-quote { background:var(--ember); padding:2rem 2.4rem; margin:1.5rem 0; font-family:'IM Fell English',Georgia,serif; font-style:italic; font-size:1.2rem; color:var(--parchment); line-height:1.55; }
.clearfix::after { content:''; display:table; clear:both; }
.closing-statement { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.4rem,2.8vw,2.2rem); color:var(--bark); line-height:1.3; margin-top:1.5rem; }

/* DRIVES SECTION */
.drives-section { background:var(--ember); padding:5.5rem 2rem; margin-top:4rem; }
.drives-section-inner { max-width:780px; margin:0 auto; }
.drives-section .section-label { color:var(--parchment); opacity:0.55; }
.drives-headline { font-family:'IM Fell English',Georgia,serif; font-size:clamp(1.8rem,3.5vw,2.8rem); color:var(--parchment); font-weight:400; line-height:1.2; margin-bottom:2rem; }
.drives-section .prose p { color:var(--parchment); opacity:0.9; max-width:58ch; }


/* COME SECTION */
.come-section { position:relative; background-image:linear-gradient(rgba(245,239,227,0.78),rgba(245,239,227,0.78)),url("images/HTMAfooter.png"); background-size:cover; background-position:center; background-repeat:no-repeat; padding:5.5rem 2rem; }
.come-section-inner { max-width:680px; margin:0 auto; text-align:center; position:relative; z-index:1; }
.come-section .section-label { text-align:center; color:var(--ember); opacity:0.75; }
.come-headline { font-family:'IM Fell English',Georgia,serif; font-size:clamp(2rem,4vw,3rem); color:var(--bark); font-weight:400; line-height:1.2; margin-bottom:1.8rem; }
.come-section .prose { text-align:left; display:inline-block; }
.come-section .prose p { color:var(--earth); max-width:58ch; }

/* BUTTONS */
.btn { display:inline-block; padding:0.85rem 2.4rem; font-family:'Crimson Pro',serif; font-size:0.82rem; letter-spacing:0.18em; text-transform:uppercase; text-decoration:none; transition:all 0.25s ease; cursor:pointer; border-radius:999px; }

@media (max-width:960px) { .nav-links { display:none; } .burger { display:flex; } }

/* RESPONSIVE */
@media (max-width:860px) {
.block-1,.block-2,.block-4 { grid-template-columns:1fr; padding:0 1.5rem 3rem; }
.block-3 { padding:3rem 1.5rem; }
.block-4 { padding:3rem 1.5rem 0; }
.arch-photo-frame { float:none; margin:0 auto 2rem; width:60%; }
}

/* MOBILE LAYOUT */
@media (max-width:860px) {
body { font-size:17px; line-height:1.65; }
.page-header { padding:0.75rem 1.25rem; margin-top:64px; }
.hero-photo-wrap { height: 100svh; }
.hero-photo-wrap img { object-position:center center; }
.hero-text { top:50%; padding:2rem 1.5rem; text-align:left; }
.hero-text blockquote { font-size:clamp(1.45rem,6vw,2rem); line-height:1.3; }
.hero-credentials { bottom:1.25rem; padding:0 1rem; font-size:0.62rem; letter-spacing:0.16em; }
.story-section { padding:3.5rem 0; }
.block-1,.block-2,.block-4 { display:flex; flex-direction:column; gap:1rem; width:100%; max-width:none; margin:0; padding:0 1.25rem 3rem; }
.block-1 .story-left p,.block-2 .story-right p,.block-4 .story-right p { line-height:1.7; margin-bottom:1.2rem; }
.frame-single { width:82%; max-width:420px; margin:0 auto; }
.block-2 .story-right { order:1; width:100%; }
.block-2 .story-left { order:2; position:relative; width:100%; max-width:300px; height:280px; margin:0 auto; }
.frame-back { width:72%; top:-10px; left:-10%; }
.frame-front { width:62%; bottom:-20px; right:-10%; }
.block-3 { padding:3rem 1.5rem 5rem; position:relative; z-index:2; overflow:visible; margin-bottom:2rem; }
.block-3 p { font-size:1.25rem; line-height:1.5; }
.block-4 { position:relative; z-index:1; }
.block-4 .story-left { padding:1.75rem; }
.page-wrap { width:100%; max-width:100%; padding:0 1.25rem; }
.prose { width:100%; }
.prose p { max-width:none; line-height:1.7; margin-bottom:1.25rem; }
.arch-section { padding:4rem 1.25rem 3.5rem; background-position:center; }
.arch-section-inner { width:100%; }
.arch-headline { font-size:clamp(1.7rem,7vw,2.3rem); }
.arch-intro { margin-bottom:2.5rem; font-size:1rem; }
.arch-grid { grid-template-columns:1fr; gap:1.5rem; justify-items:center; }
.arch-card { width:100%; max-width:320px; }
.arch-shape { width:100%; min-height:330px; border-radius:160px 160px 0 0; padding:2rem 1.5rem; }
.arch-word { font-size:2.3rem; }
.arch-shape-body { font-size:0.95rem; line-height:1.6; }
.accordion-section { width:100%; }
details summary { gap:1rem; padding:1.5rem 0; }
.summary-title { font-size:clamp(1.25rem,5.5vw,1.7rem); line-height:1.2; }
.summary-icon { width:30px; height:30px; font-size:1rem; }
.accordion-body { padding-bottom:1.5rem; }
.acc-block,.acc-block-dark { padding:1.5rem 1.25rem; margin:1rem 0; }
.acc-block-amber { padding:1.25rem; margin:1rem 0; }
.acc-block-label { font-size:12px; letter-spacing:0.18em; margin-bottom:0.65rem; }
.body-box { width:100%; padding:1.35rem 1.25rem; margin:0.5rem 0; }
.body-box p { margin:0!important; line-height:1.65; }
.who-quote { padding:1.5rem 1.25rem; margin:1rem 0; font-size:1.1rem; line-height:1.5; }
.drives-section { padding:4rem 1.25rem; margin-top:2.5rem; }
.drives-section-inner { width:100%; }
.drives-headline { font-size:clamp(1.8rem,7vw,2.5rem); }
.drives-section .prose p { max-width:none; }
.come-section { padding:4rem 1.25rem; }
.come-section-inner { width:100%; max-width:680px; }
.come-headline { font-size:clamp(1.9rem,8vw,2.7rem); }
.come-section .prose { width:100%; }
.come-section .prose p { max-width:none; }
.btn { width:100%; max-width:340px; text-align:center; padding:0.8rem 1.5rem; }
}

/* SMALL PHONES */
@media (max-width:480px) {
body { font-size:16px; }
.page-wrap { padding:0 1rem; }
.hero-photo-wrap { height: 100svh; }
.hero-text { padding:1.5rem 1.25rem; }
.hero-text blockquote { font-size:1.45rem; }
.hero-credentials { font-size:0.58rem; letter-spacing:0.13em; }
.block-1,.block-2,.block-4 { padding-left:1rem; padding-right:1rem; }
.block-4 .story-left { padding:1.35rem; }
.arch-section { padding-left:1rem; padding-right:1rem; }
.arch-shape { min-height:310px; padding:1.75rem 1.25rem; }
details summary { padding:1.35rem 0; }
.summary-title { font-size:1.3rem; }
.body-box { padding:1.25rem 1.1rem; }
.acc-block,.acc-block-dark { padding:1.35rem 1.1rem; }
.who-quote { padding:1.35rem 1.1rem; }
}