/* Exact extract from Klyuch_Placebo_Landing_Updated_v2.html */
:root{--dark:#131311;--cream:#f2eee7;--white:#f9f5ed;--gold:#dfc49b;--line:#d4cdc2;--muted:#aca69d}
*{box-sizing:border-box}
html,body{margin:0}
body{background:#131311;color:var(--white);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}
button,a,input{font:inherit}
button{cursor:pointer}
a{text-decoration:none;color:inherit}
.site{container-type:inline-size;container-name:site;--pad:clamp(32px,6.4cqw,98px);background:var(--dark);overflow-x:clip;color:var(--white);min-height:100vh}
.site h1,.site h2,.site h3,.site p{margin:0}
.site h1,.site h2,.site h3,.serif{font-family:Georgia,'Times New Roman',serif;font-weight:400}
.site p{line-height:1.48}
.site ::selection{background:var(--gold);color:var(--dark)}
.topnav{position:sticky;top:0;z-index:10;background:#131311eb;backdrop-filter:blur(16px);display:flex;justify-content:space-between;align-items:center;gap:20px;padding:0 var(--pad);height:83px;border-bottom:1px solid #ffffff1e}
.brand{display:inline-flex;align-items:center;flex-shrink:0;line-height:0;max-height:100%}
.brand-logo{display:block;height:58px;width:auto;max-height:calc(100% - 14px);object-fit:contain}
.brand-logo--footer{height:96px;max-height:none}
.navlinks{display:flex;align-items:center;gap:32px}
.navlinks a{font-size:13px;color:#ddd5ca}
.navlinks a:hover{color:#fff}
.navlinks form{display:inline;margin:0}
.nav-cta{background:#e8d2b1;color:#201d19;padding:12px 20px;border-radius:40px;font-size:13px;font-weight:700;border:0}
.hamburger{display:none;border:0;background:transparent;color:#fff;font-size:26px;padding:7px}
.topnav-app{background:rgba(16,16,14,.96)}
.app-nav{display:flex;align-items:center;justify-content:flex-end;gap:18px;flex:1;min-width:0}
.app-nav-tabs{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:999px;background:#ffffff0d;border:1px solid #ffffff14}
.app-nav-link{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 16px;border-radius:999px;font-size:13px;font-weight:650;color:#cfc6ba}
.app-nav-link:hover{color:#fff;background:#ffffff12}
.app-nav-link.is-active{color:#1d1914;background:linear-gradient(135deg,#f0d7b0,#dfc49b)}
.app-nav-meta{display:inline-flex;align-items:center;gap:12px}
.nav-user-chip{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:0 12px 0 10px;border-radius:999px;border:1px solid #ffffff1a;background:#ffffff08;color:#ead7b7;font-size:12px;font-weight:700}
.nav-user-dot{width:7px;height:7px;border-radius:50%;background:#dfc49b;box-shadow:0 0 0 4px rgba(223,196,155,.12)}
.nav-logout{border:0;background:transparent;color:#b7aea2;font-size:13px;padding:6px 2px;cursor:pointer}
.nav-logout:hover{color:#fff}
.kp-link-btn{background:none;border:0;color:#dbd6cc;font-size:13px;padding:0;cursor:pointer}
.kp-link-btn:hover{color:#fff}
.hero{position:relative;min-height:calc(100svh - 83px);min-height:calc(100dvh - 83px);display:flex;align-items:center;isolation:isolate;overflow:visible}
.hero:before{content:"";position:absolute;inset:0 0 0 31%;z-index:-2;background:url('/static/img/hero.webp') center / cover no-repeat;filter:saturate(.9)}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#131311 0%,#131311 27%,#131311ec 43%,#13131122 76%),linear-gradient(0deg,#131311c7 0%,transparent 45%)}
.hero-content{padding:clamp(48px,8vh,90px) var(--pad) clamp(48px,7vh,90px);max-width:790px;width:100%}
.overline{font-size:12px!important;line-height:1.3!important;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);font-weight:700}
.hero h1{font-size:clamp(65px,7.8cqw,110px);letter-spacing:-.068em;line-height:.98;margin:28px 0 26px}
.hero h1 em{color:var(--gold);font-style:normal}
.hero-copy{font-size:clamp(18px,1.85cqw,23px);line-height:1.45!important;max-width:480px;color:#e9e2d9;margin-bottom:36px!important}
.cta{display:inline-flex;align-items:center;justify-content:space-between;gap:14px;max-width:100%;background:#ead7b7;border:0;color:#28221a;border-radius:50px;padding:16px 22px;min-height:61px;font-size:15px;font-weight:700;box-shadow:0 4px 22px #0002;transition:transform .17s,background .17s;white-space:nowrap;box-sizing:border-box}
.cta:hover{transform:translateY(-2px);background:#fff0d7}
.cta .arr{font-size:20px;font-weight:400;flex:0 0 auto;line-height:1}
.hero-foot{font-size:14px;color:#d3c6b6;margin-top:19px!important}
.down{position:absolute;right:var(--pad);bottom:36px;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#ebddc6}
.block{padding:108px var(--pad)}
.cream{background:var(--cream);color:#24221d}
.section-id{font-size:12px!important;font-weight:700;letter-spacing:.19em;text-transform:uppercase;color:#a38766;margin-bottom:20px!important}
.heading{font-size:clamp(44px,5.25cqw,69px);line-height:1.05;letter-spacing:-.045em;max-width:950px}
.heading em{font-style:normal;color:#a8875f}
.influences{margin-top:54px;display:grid;grid-template-columns:repeat(3,1fr);gap:15px}
.influence{background:#fbf9f5;border:1px solid var(--line);border-radius:4px;padding:35px 29px 37px;min-height:257px;display:flex;flex-direction:column;justify-content:space-between}
.influence .num{font:italic 24px Georgia,serif;color:#ba9d76}
.influence h3{font-size:clamp(26px,2.75cqw,39px);line-height:1.07;letter-spacing:-.037em}
.influence p{font-size:16px;margin-top:14px;color:#6f695f;max-width:300px}
.manifesto{background:#161512;color:var(--white);padding-top:122px;padding-bottom:125px;display:grid;grid-template-columns:1.2fr .8fr;gap:80px;align-items:center}
.manifesto h2{font-size:clamp(44px,5.45cqw,75px);letter-spacing:-.05em;line-height:1.04}
.manifesto .compactcopy{font-size:19px;color:#cfc9c0;margin-top:30px;max-width:600px}
.manifesto-right{font-family:Georgia,serif;font-size:clamp(26px,3.2cqw,42px);letter-spacing:-.03em;line-height:1.2}
.manifesto-right div{padding:24px 0;border-bottom:1px solid #504940}
.manifesto-right div:first-child{border-top:1px solid #504940}
.manifesto-right .gold{color:var(--gold)}
.relationship{background:#27231d;display:grid;grid-template-columns:1.1fr .9fr;min-height:555px}
.relationship-photo{background:url('/static/img/relation.webp') 50% 45% / cover no-repeat;min-height:560px;filter:saturate(.9)}
.relationship-copy{padding:70px 70px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.relationship h2{font-size:clamp(42px,4.9cqw,69px);line-height:1.04;letter-spacing:-.05em}
.relationship p:not(.section-id){font-size:20px;line-height:1.5;color:#d7cfc4;max-width:390px;margin-top:27px}
.outcomes{background:#f7f3ec;color:#24221d}
.outcomes-list{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:51px}
.outcome{padding:29px 22px 31px 0;border-top:1px solid #b9b0a2}
.outcome .big{font:italic 24px Georgia,serif;color:#b49a76}
.outcome h3{font-size:clamp(34px,3.6cqw,48px);margin-top:25px;line-height:1}
.outcome p{margin-top:16px;font-size:17px;max-width:290px;color:#6e665d}
.format{background:#e7e0d6;color:#201f1c}
.format .heading{max-width:860px}
.format-line{display:flex;align-items:center;justify-content:space-between;gap:35px;border-top:1px solid #b6aa9c;border-bottom:1px solid #b6aa9c;padding:27px 0;margin-top:45px}
.format-line strong{font:27px Georgia,serif;font-weight:400}
.format-line span{font-size:17px;line-height:1.4;color:#655c51;max-width:470px}
.format-note{font-size:16px;color:#6c6459;margin-top:20px!important}
.final{min-height:550px;background:#141411;color:#f5eee5;position:relative;display:flex;align-items:center;justify-content:center;text-align:center;padding:95px var(--pad);isolation:isolate}
.final:before{content:"";z-index:-1;position:absolute;inset:0;background:linear-gradient(90deg,#141410bd,#1414108a),linear-gradient(0deg,#141410de 0%,transparent 80%),url('/static/img/final.webp') center / cover no-repeat;filter:saturate(.8)}
.final-inner{max-width:900px}
.final h2{font-size:clamp(49px,6.3cqw,83px);letter-spacing:-.048em;line-height:1.04}
.final p{font-size:20px;color:#e2d6c7;margin:22px 0 34px!important}
.final-note{font-size:14px!important;margin-top:19px!important;color:#dfd4c5!important}
.footer{background:#121210;border-top:1px solid #ffffff23;padding:34px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:30px}
.footer .brand{line-height:0}
.foot-caption{font-size:12px;color:#928c84;max-width:520px}
@container (max-width:850px){
 .site{--pad:27px}.topnav{height:70px}.brand-logo{height:46px}.navlinks,.nav-cta,.topnav > a.nav-cta{display:none!important}.hamburger{display:block}.navlinks.open{display:flex;position:absolute;top:69px;left:0;right:0;background:#181714;flex-direction:column;align-items:stretch;gap:0;padding:13px var(--pad) 23px;box-shadow:0 16px 28px #0009}.navlinks.open a{font-size:17px;padding:15px 0;border-bottom:1px solid #484038}
 .hero{min-height:calc(100svh - 70px);min-height:calc(100dvh - 70px);display:block}.hero:before{inset:0 0 42% 0;background-position:60% 30%}.hero:after{background:linear-gradient(0deg,#131311 0%,#131311 29%,#131311dd 40%,#13131113 82%)}.hero-content{padding:320px var(--pad) 55px;max-width:none}.overline{font-size:10px!important;letter-spacing:.11em}.hero h1{font-size:clamp(52px,11.9cqw,75px);margin:17px 0 19px}.hero-copy{font-size:19px;max-width:620px;margin-bottom:26px!important}.hero .cta{width:100%}.hero-foot{font-size:14px!important}.down{display:none}
 .block{padding:82px var(--pad)}.heading{font-size:clamp(42px,9.2cqw,58px)}.influences{display:grid;grid-template-columns:1fr;margin-top:35px;gap:10px}.influence{min-height:155px;padding:22px 23px}.influence h3{font-size:31px;margin-top:16px}.influence p{margin-top:8px;font-size:16px;max-width:none}
 .manifesto{display:block;padding-top:95px;padding-bottom:95px}.manifesto h2{font-size:clamp(44px,10.4cqw,68px)}.manifesto .compactcopy{font-size:18px;margin-top:25px}.manifesto-right{margin-top:45px;font-size:30px}
 .relationship{grid-template-columns:1fr}.relationship-photo{min-height:380px}.relationship-copy{padding:65px var(--pad) 74px}.relationship h2{font-size:clamp(43px,10cqw,62px)}.relationship p:not(.section-id){font-size:18px}
 .outcomes-list{grid-template-columns:1fr;gap:0;margin-top:30px}.outcome{padding:23px 0 28px}.outcome h3{font-size:45px;margin-top:9px}.outcome p{max-width:none;font-size:17px;margin-top:9px}
 .format-line{display:block}.format-line strong{display:block;font-size:27px}.format-line span{display:block;font-size:17px;margin-top:14px}.format-note{font-size:15px}
 .final{min-height:540px;padding:100px var(--pad)}.final h2{font-size:clamp(46px,10cqw,64px)}.final p{font-size:19px!important}.final .cta{width:100%}.footer{padding:30px var(--pad);align-items:flex-start;flex-direction:column;gap:17px}
}
@container (max-width:370px){.site{--pad:21px}.hero{min-height:calc(100svh - 70px)}.hero-content{padding-top:min(322px,40vh)}.hero h1{font-size:49px}.hero-copy{font-size:18px}.influence h3{font-size:29px}.heading{font-size:40px}.manifesto h2{font-size:42px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}
.navlinks{gap:clamp(14px,2.2cqw,31px)}
.navlinks a{white-space:nowrap}
.nav-cta{white-space:nowrap;font-size:14px;padding:14px 22px}
.hero-actions{display:flex;align-items:stretch;flex-wrap:wrap;gap:12px;max-width:100%}
.hero-entry{background:linear-gradient(135deg,#f4d7aa,#dfb983);color:#1b1814;min-width:min(100%,260px);flex:1 1 260px;min-height:64px;font-size:16px;box-shadow:0 0 0 1px #f0d6ae55,0 12px 33px #0006}
.cta-secondary{background:transparent;color:#f3e8d6;border:1px solid #d6bb91;box-shadow:none;min-height:64px;font-size:15px;min-width:min(100%,280px);flex:1 1 280px;padding:16px 20px}
.cta-secondary:hover{background:#f1ddbe;color:#1d1a16}
.influences{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.influence{min-height:250px;padding:29px 31px 31px}
.influence h3{font-size:clamp(27px,2.7cqw,39px)}
.influence p{font-size:17px;max-width:480px}
.schedule{color:var(--white);background:#1d1b18}
.schedule .heading em{color:var(--gold)}
.schedule-panel{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(270px,.8fr);border:1px solid #645748;gap:55px;padding:44px 48px;margin-top:48px;background:linear-gradient(130deg,#29251e,#181714);border-radius:6px}
.schedule-tag{color:var(--gold);text-transform:uppercase;letter-spacing:.17em;font-size:12px!important;font-weight:700;margin-bottom:21px!important}
.schedule-main h3{font-size:clamp(37px,4.2cqw,57px);letter-spacing:-.045em;line-height:1.03}
.schedule-main p:last-child{margin-top:23px;font-size:18px;color:#cec3b4;max-width:500px}
.schedule-side{display:flex;flex-direction:column;justify-content:center;gap:0;border-left:1px solid #74685b;padding-left:35px}
.schedule-pair{padding:16px 0 21px;border-bottom:1px solid #574f45;display:flex;flex-direction:column;gap:7px}
.schedule-pair span{font-size:13px;color:#bcb1a1}
.schedule-pair strong{font:27px Georgia,serif;font-weight:400;color:#fff1df}
.schedule-side .cta{margin-top:27px;white-space:nowrap;gap:16px;padding:17px 22px}
.login-back{width:100%;margin-top:27px}
@container (max-width:850px){
 .hero{min-height:calc(100svh - 70px);min-height:calc(100dvh - 70px)}.hero-content{padding-top:min(320px,42vh)}
 .hero-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px}
 .hero-actions .cta{width:100%;min-width:0;min-height:61px;font-size:16px;padding:16px 14px}
 .influences{grid-template-columns:1fr;gap:11px}
 .influence{min-height:158px;padding:22px 23px}
 .influence h3{font-size:clamp(27px,6.6cqw,34px)}
 .schedule-panel{display:block;padding:27px 22px;margin-top:33px}
 .schedule-side{padding-left:0;border-left:0;margin-top:25px;border-top:1px solid #706252}
 .schedule-main h3{font-size:clamp(39px,9cqw,54px)}
 .schedule-side .cta{width:100%;margin-top:25px;white-space:normal}
}
@container (max-width:370px){.hero{min-height:calc(100svh - 70px)}.hero-content{padding-top:min(312px,40vh)}.influence h3{font-size:27px}}

a.nav-cta,a.cta{display:inline-flex;align-items:center;justify-content:center;text-decoration:none}
a.cta{box-sizing:border-box}
@media (max-width:850px){
  .topnav > a.nav-cta,
  .topnav a.nav-cta{display:none!important}
}
@container (max-width:850px){
  .topnav > a.nav-cta,
  .topnav a.nav-cta{display:none!important}
}

/* media fallbacks */
@media (max-width:850px){
 .site{--pad:27px}.topnav{height:70px}.brand-logo{height:46px}.navlinks,.nav-cta,.topnav > a.nav-cta{display:none!important}.hamburger{display:block}.navlinks.open{display:flex;position:absolute;top:69px;left:0;right:0;background:#181714;flex-direction:column;align-items:stretch;gap:0;padding:13px var(--pad) 23px;box-shadow:0 16px 28px #0009}.navlinks.open a{font-size:17px;padding:15px 0;border-bottom:1px solid #484038}
 .hero{min-height:calc(100svh - 70px);min-height:calc(100dvh - 70px);display:block}.hero:before{inset:0 0 42% 0;background-position:60% 30%}.hero:after{background:linear-gradient(0deg,#131311 0%,#131311 29%,#131311dd 40%,#13131113 82%)}.hero-content{padding:320px var(--pad) 55px;max-width:none}.overline{font-size:10px!important;letter-spacing:.11em}.hero h1{font-size:clamp(52px,11.9cqw,75px);margin:17px 0 19px}.hero-copy{font-size:19px;max-width:620px;margin-bottom:26px!important}.hero .cta{width:100%}.hero-foot{font-size:14px!important}.down{display:none}
 .block{padding:82px var(--pad)}.heading{font-size:clamp(42px,9.2cqw,58px)}.influences{display:grid;grid-template-columns:1fr;margin-top:35px;gap:10px}.influence{min-height:155px;padding:22px 23px}.influence h3{font-size:31px;margin-top:16px}.influence p{margin-top:8px;font-size:16px;max-width:none}
 .manifesto{display:block;padding-top:95px;padding-bottom:95px}.manifesto h2{font-size:clamp(44px,10.4cqw,68px)}.manifesto .compactcopy{font-size:18px;margin-top:25px}.manifesto-right{margin-top:45px;font-size:30px}
 .relationship{grid-template-columns:1fr}.relationship-photo{min-height:380px}.relationship-copy{padding:65px var(--pad) 74px}.relationship h2{font-size:clamp(43px,10cqw,62px)}.relationship p:not(.section-id){font-size:18px}
 .outcomes-list{grid-template-columns:1fr;gap:0;margin-top:30px}.outcome{padding:23px 0 28px}.outcome h3{font-size:45px;margin-top:9px}.outcome p{max-width:none;font-size:17px;margin-top:9px}
 .format-line{display:block}.format-line strong{display:block;font-size:27px}.format-line span{display:block;font-size:17px;margin-top:14px}.format-note{font-size:15px}
 .final{min-height:540px;padding:100px var(--pad)}.final h2{font-size:clamp(46px,10cqw,64px)}.final p{font-size:19px!important}.final .cta{width:100%}.footer{padding:30px var(--pad);align-items:flex-start;flex-direction:column;gap:17px}
}
@media (max-width:850px){
 .hero{min-height:calc(100svh - 70px);min-height:calc(100dvh - 70px)}.hero-content{padding-top:min(320px,42vh)}
 .hero-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px}
 .hero-actions .cta{width:100%;min-width:0;min-height:61px;font-size:16px;padding:16px 14px}
 .influences{grid-template-columns:1fr;gap:11px}
 .influence{min-height:158px;padding:22px 23px}
 .influence h3{font-size:clamp(27px,6.6cqw,34px)}
 .schedule-panel{display:block;padding:27px 22px;margin-top:33px}
 .schedule-side{padding-left:0;border-left:0;margin-top:25px;border-top:1px solid #706252}
 .schedule-main h3{font-size:clamp(39px,9cqw,54px)}
 .schedule-side .cta{width:100%;margin-top:25px;white-space:normal}
}
@media (max-width:370px){.site{--pad:21px}.hero{min-height:calc(100svh - 70px)}.hero-content{padding-top:min(322px,40vh)}.hero h1{font-size:49px}.hero-copy{font-size:18px}.influence h3{font-size:29px}.heading{font-size:40px}.manifesto h2{font-size:42px}}

/* fit long CTA label + arrow */
.hero-actions .cta{overflow:visible}
.hero-actions .cta .arr{margin-left:auto}
@media (max-width:1100px){
  .hero-actions{flex-direction:column;align-items:stretch}
  .hero-actions .cta{width:100%;min-width:0;flex:none;white-space:normal;text-align:left}
  .hero-actions .cta .arr{margin-left:12px}
}
@media (max-width:850px){
  .hero{align-items:stretch}
  .hero-content{padding-bottom:48px}
  .hero-actions .cta{white-space:normal;font-size:15px;padding:15px 18px}
}

/* auth modals — from Klyuch_Placebo_Landing_Updated_v2.html */
.modal{position:fixed;inset:0;z-index:90;background:#0a0908c9;backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:20px}
.modal.open{display:flex}
.modal-card{background:#f3eee6;color:#29241f;position:relative;width:min(470px,100%);border-radius:8px;padding:46px 42px 37px;box-shadow:0 20px 100px #0009}
.modal-card h2{font:40px/1.1 Georgia,'Times New Roman',serif;font-weight:400;margin:0 0 17px}
.modal-card > p{font-size:15px;color:#685f54;line-height:1.5;margin:0}
.modal-card .section-id{margin-bottom:14px!important}
.close{position:absolute;top:15px;right:17px;border:0;background:transparent;color:#62594c;font-size:29px;padding:4px;line-height:1;text-decoration:none;cursor:pointer}
.close:hover{color:#29241f}
.modal form{display:grid;gap:11px;margin-top:27px}
.modal label{font-size:12px;font-weight:700;margin-top:9px;color:#29241f}
.modal input{background:white;border:1px solid #cfc5b8;border-radius:6px;padding:14px 15px;outline-color:#baa17d;width:100%;font-size:16px;color:#29241f;box-sizing:border-box}
.modal .cta{width:100%;margin-top:14px;min-height:56px;justify-content:center;gap:14px;white-space:nowrap}
.modal-foot{margin-top:20px!important;font-size:12px!important;color:#726b60!important}
.modal-foot a{color:#29241f;font-weight:700;border-bottom:1px solid currentColor}
.modal .alert{margin-top:18px;padding:14px 16px;border-radius:6px;font-size:14px;line-height:1.4}
.modal .alert.error{background:#f3d9d4;color:#6d2f2a}
.auth-page{min-height:100vh;background:#131311 url('/static/img/hero.webp') center/cover no-repeat;position:relative}
.auth-page:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#131311e8,#131311b8),linear-gradient(0deg,#131311d0,transparent 55%)}
.auth-page .modal{position:fixed}
@media (max-width:520px){
  .modal-card{padding:38px 22px 28px}
  .modal-card h2{font-size:32px}
}

/* hero viewport fill across monitors */
@media (min-width:851px){
  .hero{min-height:calc(100svh - 83px);min-height:calc(100dvh - 83px)}
}
@media (min-height:900px) and (min-width:851px){
  .hero-content{padding-top:clamp(70px,10vh,120px);padding-bottom:clamp(60px,9vh,110px)}
  .hero h1{font-size:clamp(65px,7.2vw,110px)}
}
@supports not (height:100svh){
  .hero{min-height:calc(100vh - 83px)}
}
