/* House of Kelso v2 : red, white, charcoal, with turquoise, gold and blush accents */
:root{
  --red:#D7263D; --red-bright:#E3203B; --red-deep:#B81E33;
  --white:#FFFFFF; --ivory:#FBF8F4; --charcoal:#2B2A2E; --ink:#3A393E; --muted:#6E6A70;
  --teal:#1BA3C6; --gold:#F2A65A; --blush:#F3DCD6; --blush-deep:#E7BDB4;
  --serif:"Cormorant Garamond", Georgia, "Times New Roman", serif;
  --sans:"Jost", "Helvetica Neue", Arial, sans-serif;
  --wrap:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans);font-weight:300;color:var(--charcoal);background:var(--white);line-height:1.75;font-size:17px;-webkit-font-smoothing:antialiased}
img,svg{display:block}
a{color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 28px}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:#fff;padding:8px 12px;z-index:99}

/* Labels and type */
.label{font-family:var(--sans);font-weight:400;text-transform:uppercase;letter-spacing:.42em;font-size:.74rem}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.15}
h2{font-size:clamp(2rem,3.6vw,2.8rem);margin-bottom:.5em}
h3{font-size:1.55rem;margin-bottom:.35em}
.tracked{font-family:var(--sans);font-weight:300;text-transform:uppercase;letter-spacing:.38em}
.colon-line{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,2.4vw,1.75rem);line-height:1.4}
.colon-line .c{display:inline-block;margin:0 .45em;font-style:normal;opacity:.8}
p+p{margin-top:1em}
.lede{font-size:1.12rem;max-width:42em}

/* Nav */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-bottom:1px solid #eee}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:74px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--charcoal)}
.brand .mono{width:38px;height:38px;color:#0E6377}
.brand span{font-family:var(--sans);text-transform:uppercase;letter-spacing:.34em;font-size:.82rem;font-weight:400}
.nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 26px}
.nav a.link{text-decoration:none;text-transform:uppercase;letter-spacing:.2em;font-size:.72rem;font-weight:400;color:var(--ink);padding:6px 0;border-bottom:1px solid transparent}
.nav a.link:hover,.nav a.link[aria-current]{color:var(--red);border-bottom-color:var(--red)}
.nav a.link.ai{color:var(--red)}

/* Red sections */
.red{position:relative;background-color:var(--red);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22120%22%20height%3D%22160%22%20viewBox%3D%220%200%20120%20160%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-opacity%3D%220.07%22%20stroke-width%3D%221.4%22%3E%3Cpath%20d%3D%22M60%2010%20C80%2030%2095%2050%2060%2080%20C25%2050%2040%2030%2060%2010%20Z%22/%3E%3Cpath%20d%3D%22M60%2080%20C80%20110%2095%20130%2060%20150%20C25%20130%2040%20110%2060%2080%20Z%22/%3E%3Cpath%20d%3D%22M60%2030%20C70%2042%2070%2055%2060%2064%20C50%2055%2050%2042%2060%2030%20Z%22/%3E%3Cpath%20d%3D%22M60%2096%20C70%20108%2070%20121%2060%20130%20C50%20121%2050%20108%2060%2096%20Z%22/%3E%3Cpath%20d%3D%22M0%2080%20C20%2060%2030%2040%200%200%22/%3E%3Cpath%20d%3D%22M120%2080%20C100%2060%2090%2040%20120%200%22/%3E%3Cpath%20d%3D%22M0%2080%20C20%20100%2030%20120%200%20160%22/%3E%3Cpath%20d%3D%22M120%2080%20C100%20100%2090%20120%20120%20160%22/%3E%3Cpath%20d%3D%22M20%2080%20C14%2072%206%2074%208%2082%20C10%2088%2018%2086%2016%2080%22/%3E%3Cpath%20d%3D%22M100%2080%20C106%2072%20114%2074%20112%2082%20C110%2088%20102%2086%20104%2080%22/%3E%3C/g%3E%3C/svg%3E");color:var(--white);overflow:hidden}
.red h1,.red h2,.red h3{color:var(--white)}

/* Hero */
.hero{min-height:620px;display:flex;align-items:center;padding:90px 0 110px}
.hero .medallion{position:absolute;left:-310px;top:50%;width:620px;height:620px;transform:translateY(-50%)}
.medallion .lace{fill:none;stroke:var(--gold);stroke-width:2;opacity:.62}
.medallion .ring{stroke-dasharray:2 6}
.medallion .dot{fill:var(--gold);stroke:none}
.hero .hero-mono{position:absolute;left:34px;top:50%;width:132px;height:132px;transform:translateY(-50%);filter:drop-shadow(0 2px 10px rgba(0,0,0,.18))}
.hero .trail{position:absolute;left:70px;top:50%;width:520px;height:440px;pointer-events:none}
.hero .content{position:relative;margin-left:max(330px, calc((100vw - var(--wrap))/2 + 300px));padding-right:28px;max-width:720px}
.hero .eyebrow{opacity:.92;margin-bottom:22px}
.hero h1{font-family:var(--sans);font-weight:300;text-transform:uppercase;letter-spacing:.32em;font-size:clamp(2.2rem,4.8vw,3.9rem);line-height:1.15}
.hero .sub{font-family:var(--serif);font-size:1.45rem;margin-top:12px;opacity:.95}
.hero .tagline{margin-top:30px;font-family:var(--sans);font-weight:400;letter-spacing:.24em;text-transform:uppercase;font-size:.95rem}
.hero .colon-line{margin-top:18px}
.hero.page{min-height:420px;padding:70px 0 90px}
.hero.page .medallion{width:500px;height:500px;left:-250px}
.hero.page .hero-mono{width:104px;height:104px;left:20px}
.hero.page .trail{width:440px;height:360px;left:50px}
.hero.page .content{margin-left:max(290px, calc((100vw - var(--wrap))/2 + 250px))}
.hero.page h1{font-size:clamp(1.9rem,3.8vw,3rem)}

.btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.btn{display:inline-block;text-decoration:none;text-transform:uppercase;letter-spacing:.24em;font-size:.74rem;font-weight:400;padding:15px 26px;border:1px solid currentColor;transition:background .25s,color .25s}
.red .btn{color:#fff}.red .btn.solid{background:#fff;color:var(--red);border-color:#fff}
.red .btn:hover{background:#fff;color:var(--red)}.red .btn.solid:hover{background:transparent;color:#fff}
.btn.dark{color:var(--red);border-color:var(--red)}.btn.dark:hover{background:var(--red);color:#fff}
.btn.fill{background:var(--red);color:#fff;border-color:var(--red)}.btn.fill:hover{background:var(--red-deep)}

/* Corner triangle with monogram */
.corner{position:absolute;right:0;bottom:0;width:150px;height:150px;pointer-events:none}
.corner svg:first-child{position:absolute;inset:0;width:100%;height:100%}
.corner .corner-mono{position:absolute;right:20px;bottom:20px;width:46px;height:46px;color:#fff}

/* White panel with red edge line and black butterfly trail */
.panel{position:relative;padding:100px 0}
.panel.edge::before{content:"";position:absolute;left:max(18px, calc((100vw - var(--wrap))/2 - 10px));top:70px;bottom:70px;width:2px;background:var(--red)}
.panel .split{display:grid;grid-template-columns:230px 1fr;gap:56px;align-items:start}
.panel .trail-col .trail{width:200px;height:400px}
.panel.ivory{background:var(--ivory)}
.panel.blush{background:var(--blush);background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20width%3D%22120%22%20height%3D%22160%22%20viewBox%3D%220%200%20120%20160%22%3E%3Cg%20fill%3D%22none%22%20stroke%3D%22%23D7263D%22%20stroke-opacity%3D%220.06%22%20stroke-width%3D%221.4%22%3E%3Cpath%20d%3D%22M60%2010%20C80%2030%2095%2050%2060%2080%20C25%2050%2040%2030%2060%2010%20Z%22/%3E%3Cpath%20d%3D%22M60%2080%20C80%20110%2095%20130%2060%20150%20C25%20130%2040%20110%2060%2080%20Z%22/%3E%3Cpath%20d%3D%22M60%2030%20C70%2042%2070%2055%2060%2064%20C50%2055%2050%2042%2060%2030%20Z%22/%3E%3Cpath%20d%3D%22M60%2096%20C70%20108%2070%20121%2060%20130%20C50%20121%2050%20108%2060%2096%20Z%22/%3E%3Cpath%20d%3D%22M0%2080%20C20%2060%2030%2040%200%200%22/%3E%3Cpath%20d%3D%22M120%2080%20C100%2060%2090%2040%20120%200%22/%3E%3Cpath%20d%3D%22M0%2080%20C20%20100%2030%20120%200%20160%22/%3E%3Cpath%20d%3D%22M120%2080%20C100%20100%2090%20120%20120%20160%22/%3E%3Cpath%20d%3D%22M20%2080%20C14%2072%206%2074%208%2082%20C10%2088%2018%2086%2016%2080%22/%3E%3Cpath%20d%3D%22M100%2080%20C106%2072%20114%2074%20112%2082%20C110%2088%20102%2086%20104%2080%22/%3E%3C/g%3E%3C/svg%3E")}
.panel.blush .feather{position:absolute;right:0;top:0;width:min(40vw,460px);height:170px;opacity:.75}
.panel.blush>.wrap{position:relative;z-index:1}
.quote{font-family:var(--serif);font-style:italic;font-size:1.5rem;line-height:1.4;color:var(--charcoal)}
.quote cite{display:block;margin-top:8px;font-style:normal;font-family:var(--sans);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--red)}
.kicker{color:var(--red);margin-bottom:14px}
.blush .kicker{color:var(--red-deep)}

/* Cards */
.grid{display:grid;gap:26px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g2{grid-template-columns:repeat(2,1fr)}
.card{position:relative;background:#fff;border:1px solid #ece6e2;padding:34px 28px 38px;overflow:hidden}
.card .mono{width:40px;height:40px;color:var(--red);margin-bottom:18px}
.card h3{font-size:1.45rem}
.card p{font-size:.98rem;color:var(--ink)}
.card .more{display:inline-block;margin-top:16px;text-decoration:none;color:var(--red);text-transform:uppercase;letter-spacing:.22em;font-size:.7rem;font-weight:400;border-bottom:1px solid var(--red)}
.card .tag{position:absolute;top:18px;right:18px;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;color:var(--teal);font-weight:500}
.card.accent{border-top:3px solid var(--red)}
.card.teal{border-top:3px solid var(--teal)}
.card .num{font-family:var(--serif);font-size:3rem;color:var(--red);line-height:1;margin-bottom:10px}

/* Services list with dotted leaders */
.svc-head{margin-bottom:34px}
.svc-group{margin-bottom:46px}
.svc-group h3{font-family:var(--sans);font-weight:400;text-transform:uppercase;letter-spacing:.32em;font-size:1rem;margin-bottom:6px}
.svc-group .note{opacity:.9;font-size:.98rem;max-width:46em;margin-bottom:12px}
.leaders{list-style:none}
.leaders li{display:flex;align-items:baseline;gap:10px;padding:5px 0;font-size:1rem}
.leaders li .dots{flex:1;border-bottom:1.5px dotted rgba(255,255,255,.7);transform:translateY(-4px);min-width:30px}
.leaders li .v{text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;font-weight:400;white-space:nowrap}
.light .leaders li .dots{border-bottom-color:rgba(43,42,46,.45)}
.light .leaders li .v{color:var(--red)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:20px 70px}

/* Steps */
.steps{counter-reset:s}
.step{padding:30px 26px;background:#fff;border-left:2px solid var(--red)}
.step .label{color:var(--teal);margin-bottom:8px}

/* Offer */
.offer{position:relative;background:#fff;border:1px solid #e8e1dc;border-top:4px solid var(--teal);padding:46px 46px 50px;overflow:hidden}
.offer .trail{position:absolute;right:20px;top:10px;width:180px;height:300px;color:var(--red);opacity:.6}

/* Collection */
.collection-card{min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(160deg,#fff 0%,var(--ivory) 100%)}
.collection-card .trail{position:absolute;right:6px;top:6px;width:120px;height:170px;opacity:.85}
.soon{display:inline-block;margin-top:14px;padding:6px 12px;border:1px solid var(--teal);color:var(--teal);font-size:.64rem;letter-spacing:.28em;text-transform:uppercase;font-weight:500;align-self:flex-start}

/* CTA band */
.cta{padding:90px 0 120px;text-align:center}
.cta .mono{width:84px;height:84px;margin:0 auto 22px;color:#fff}
.cta p{max-width:38em;margin:14px auto 0}
.cta .btns{justify-content:center}
.email-big{font-family:var(--serif);font-size:clamp(1.5rem,3vw,2.2rem);color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.6)}

/* Footer */
footer{position:relative;background:var(--charcoal);color:#e9e5e2;padding:60px 0 70px;overflow:hidden}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:24px;align-items:flex-end}
footer .mono{width:48px;height:48px;color:#fff;margin-bottom:14px}
footer .tracked{font-size:.78rem}
footer p{font-size:.86rem;opacity:.85}
footer a{color:#fff}
footer .corner{width:110px;height:110px}footer .corner .corner-mono{width:34px;height:34px;right:14px;bottom:14px}
footer nav ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px 20px;margin-right:110px}
footer nav a{text-decoration:none;text-transform:uppercase;letter-spacing:.2em;font-size:.68rem}

/* Butterfly motion */
.flit{animation:flit 6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes flit{0%,100%{transform:translateY(0) scaleX(1)}50%{transform:translateY(-4px) scaleX(.82)}}
@media (prefers-reduced-motion:reduce){.flit{animation:none}}

/* Responsive */
@media (max-width:1000px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  body{font-size:16px}
  .nav{position:static}
  .hero .sub{font-size:1.25rem;line-height:1.4}
  .nav .wrap{flex-direction:column;align-items:flex-start;padding-top:14px;padding-bottom:12px;gap:8px}
  .nav ul{gap:4px 16px}
  .nav a.link{font-size:.64rem;letter-spacing:.14em}
  .hero,.hero.page{min-height:0;padding:250px 0 90px;align-items:flex-start}
  .hero .medallion,.hero.page .medallion{left:50%;top:-170px;transform:translateX(-50%);width:420px;height:420px}
  .hero .hero-mono,.hero.page .hero-mono{left:50%;top:40px;transform:translateX(-50%);width:96px;height:96px}
  .hero .trail,.hero.page .trail{left:auto;right:-60px;top:20px;width:300px;height:260px}
  .hero .content,.hero.page .content{margin-left:0;padding:0 24px}
  .hero h1{letter-spacing:.2em}
  .panel{padding:70px 0}
  .panel .split{grid-template-columns:1fr;gap:10px}
  .panel .trail-col .trail{width:120px;height:220px;margin-left:10px}
  .panel.edge::before{left:12px}
  .g4,.g3,.g2,.cols2{grid-template-columns:1fr}
  .offer{padding:34px 24px}
  .offer .trail{opacity:.25}
  .corner{width:100px;height:100px}.corner .corner-mono{width:32px;height:32px;right:12px;bottom:12px}
  footer nav ul{margin-right:0}
  footer{padding-bottom:120px}
}

/* Pull quotes */
.pull{margin-top:28px;padding:4px 0 4px 26px;border-left:2px solid var(--red);font-family:var(--serif);font-style:italic;font-size:1.4rem;line-height:1.45;color:var(--charcoal);max-width:40em}
.pull cite{display:block;margin-top:10px;font-style:normal;font-family:var(--sans);font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;color:var(--red)}
@media (max-width:760px){.pull{font-size:1.2rem;padding-left:18px}}

/* Ann Kelso mark and wordmark */
.ak-lockup{display:flex;align-items:center;gap:18px;margin:6px 0 18px}
.ak-lockup .ak{width:64px;height:64px;flex:none}
.ak-word{display:block;font-family:var(--sans);font-weight:400;text-transform:uppercase;letter-spacing:.5em;font-size:1.05rem;line-height:1.2}
.ak-sub{display:block;font-family:var(--serif);font-style:italic;font-size:1.25rem;margin-top:6px;color:var(--muted)}
.ak-white .ak-sub{color:#fff;opacity:.92;font-size:1.05rem}
.ak-redmark{color:var(--red)}.ak-redmark .ak-word{color:var(--charcoal)}
.ak-white{color:#fff;margin-bottom:12px}.ak-white .ak{width:48px;height:48px}.ak-white .ak-word{font-size:.9rem}
.card .ak-red{color:var(--red)}

/* five card collection grid: three above, two below */
.g5{grid-template-columns:repeat(6,1fr)}
.g5>*{grid-column:span 2}
.g5>*:nth-child(n+4){grid-column:span 3}
@media (max-width:1000px){.g5{grid-template-columns:1fr 1fr}.g5>*,.g5>*:nth-child(n+4){grid-column:auto}.g5>*:last-child{grid-column:span 2}}
@media (max-width:760px){.g5{grid-template-columns:1fr}.g5>*:last-child,.g5>*:nth-child(n+4){grid-column:auto}}
.collection-card h3,.collection-card p{padding-right:64px}

/* wellness authority block (services, Ann Kelso group) */
.authority{margin:22px 0 28px}
.authority .bridge{font-family:var(--serif);font-size:1.25rem;line-height:1.75;border-left:1px solid currentColor;padding-left:18px;margin:16px 0 18px;opacity:.95}
.authority .colon-line{margin-top:6px}

.card .colon-line{font-size:1.3rem;margin:10px 0 14px}
#pastoral h2+.colon-line{margin:-4px 0 18px}

/* House of Kelso scroll motif (from the original Kelso card art) */
.hero .medallion{display:none}
.hero::before{content:"";position:absolute;left:-230px;top:50%;width:600px;aspect-ratio:3513/2478;transform:translateY(-50%);background:url("assets/hok-scroll-white.svg") center/contain no-repeat;opacity:.3;pointer-events:none;z-index:0}
.hero.page::before{left:-190px;width:500px}
.hero .content{z-index:1}
.panel.ivory{overflow:hidden}
.panel.ivory::before{content:"";position:absolute;left:50%;top:50%;width:min(110vw,1100px);aspect-ratio:3513/2478;transform:translate(-50%,-50%);background:url("assets/hok-scroll.svg") center/contain no-repeat;opacity:.55;pointer-events:none;z-index:0}
.panel.ivory>.wrap{position:relative;z-index:1}
@media (max-width:760px){.panel.ivory::before{width:160vw;opacity:.45}}
@media (max-width:760px){.hero::before,.hero.page::before{left:50%;top:88px;width:340px;transform:translate(-50%,-50%);opacity:.3}}
/* v3: scroll framing the CTA monogram, and as undertone in pink sections */
.cta::before{content:"";position:absolute;left:50%;top:130px;width:270px;aspect-ratio:3513/2478;transform:translate(-50%,-50%);background:url("assets/hok-scroll-white.svg") center/contain no-repeat;opacity:.28;pointer-events:none;z-index:0}
.cta>.wrap{position:relative;z-index:1}
.panel.blush .feather{display:none}
.panel.blush{overflow:hidden}
.panel.blush::before{content:"";position:absolute;right:0;top:50%;width:min(70vw,820px);aspect-ratio:3513/2478;transform:translate(50%,-50%);background:url("assets/hok-scroll-white.svg") center/contain no-repeat;opacity:.5;pointer-events:none;z-index:0}
#startups.panel.blush::before{right:auto;left:0;transform:translate(-50%,-50%)}
@media (max-width:760px){.cta::before{width:250px}.panel.blush::before{width:120vw;opacity:.3}}
/* v4: scroll framing every HK monogram */
.mono,.ak,.corner-mono{overflow:visible}
.hk-frame{pointer-events:none}
footer .hk-frame,.corner .hk-frame{opacity:.2}
/* v5: scroll undertone in white text sections */
.panel:not(.ivory):not(.blush){overflow:hidden}
.panel:not(.ivory):not(.blush)::after{content:"";position:absolute;right:0;top:50%;width:min(70vw,820px);aspect-ratio:3513/2478;transform:translate(50%,-50%);background:url("assets/hok-scroll.svg") center/contain no-repeat;opacity:.6;pointer-events:none;z-index:0}
.panel:not(.ivory):not(.blush)>.wrap{position:relative;z-index:1}
@media (max-width:760px){.panel:not(.ivory):not(.blush)::after{width:120vw;opacity:.45}}
/* v6: white-section scroll moved to the empty top-right corner */
.panel:not(.ivory):not(.blush)::after{top:0;width:min(42vw,560px);transform:translate(38%,-30%);opacity:.7}
@media (max-width:760px){.panel:not(.ivory):not(.blush)::after{width:78vw;transform:translate(30%,-28%);opacity:.6}}
/* v7: pink-section scroll moved to the empty top-right corner (all pink sections) */
.panel.blush::before,#startups.panel.blush::before{left:auto;right:0;top:0;width:min(42vw,560px);transform:translate(38%,-30%)}
@media (max-width:760px){.panel.blush::before,#startups.panel.blush::before{width:78vw;transform:translate(30%,-28%);opacity:.45}}