/* ============================================================
   Yair Ziv Academy — Taste system (editorial minimal + brand touches)
   one ground · one ink · one accent (gold on actions) · dark brand base
   no gradients/glows/shadows on rest · no eyebrows · no 01/02 numbering · no emoji
   ============================================================ */
:root{
  /* light brushed-metal scheme (brand) */
  --ground:#c8cbcf; --s1:#e9eaec; --s2:#e0e2e5; --s3:#c6c9cd;
  --ink:#141518; --ink2:#52555b; --ink3:#83868c;
  --accent:#17181b; --accent-ink:#f2f2ef;     /* black-on-metal, like the poster */
  --gold:#9a7a32;                               /* deep gold for subtle highlights */
  --light:#f0f1f2; --light-ink:#17161a;
  --metal:url('assets/opt/bg-metal.jpg');
  --maxw:1240px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:#c8cbcf var(--metal) center top / cover fixed;color:var(--ink);font-family:'Assistant',system-ui,sans-serif;font-size:19px;line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'Heebo',sans-serif;font-weight:800;letter-spacing:-0.02em;line-height:1.02;color:var(--ink)}
.display{font-family:'Fb Jabutinski','Heebo',sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 32px}
section{position:relative}

/* nav — wordmark + few links + one action, no chrome */
.nav{display:flex;align-items:center;justify-content:space-between;height:84px}
.nav .mark{display:flex;align-items:center;gap:12px;font-family:'Heebo';font-weight:800;font-size:19px;color:var(--ink)}
.nav .mark img{height:40px;width:auto}
.nav .links{display:flex;gap:34px;align-items:center;font-family:'Heebo';font-weight:600;font-size:16px}
.nav .links a{color:var(--ink2);transition:color .2s}
.nav .links a:hover{color:var(--ink)}
.nav .act{font-family:'Heebo';font-weight:700;font-size:15px;color:var(--accent-ink);background:var(--accent);padding:11px 22px;border-radius:4px;transition:transform .2s}
.nav .act:hover{transform:translateY(-2px)}
.nav .back{color:var(--ink2);font-family:'Heebo';font-weight:600;font-size:15px}
.nav .back:hover{color:var(--ink)}

/* buttons — flat, single fill, decided once (small radius, editorial) */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:'Heebo';font-weight:700;font-size:17px;padding:16px 30px;border-radius:4px;cursor:pointer;border:none;transition:transform .2s,background .2s,color .2s}
.btn-solid{background:var(--accent);color:var(--accent-ink)}
.btn-solid:hover{transform:translateY(-2px)}
.btn-line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--s3)}
.btn-line:hover{box-shadow:inset 0 0 0 1.5px var(--ink);color:var(--ink)}
.btn .arr{transition:transform .25s}
.btn:hover .arr{transform:translateX(-5px)}

/* hero — dominant image, short headline */
.hero{min-height:88vh;display:grid;grid-template-columns:1fr 1fr;align-items:stretch}
.hero-text{display:flex;flex-direction:column;justify-content:center;padding:60px 32px 60px 70px}
.hero-text .kicker{font-family:'Heebo';font-weight:700;font-size:14px;letter-spacing:.14em;color:var(--gold);margin-bottom:22px}
.hero-text h1{font-size:clamp(46px,6.5vw,92px)}
.hero-text p{font-size:clamp(19px,1.6vw,23px);color:var(--ink2);margin:26px 0 38px;max-width:30ch}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-img{position:relative;overflow:hidden;background:var(--s1)}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 22%}

/* sections — big gaps, each its own composition */
.band{padding:150px 0}
.band.tight{padding:100px 0}
.sec-title{font-size:clamp(34px,4.5vw,60px);max-width:16ch}
.sec-lead{font-size:clamp(19px,1.5vw,22px);color:var(--ink2);max-width:48ch;margin-top:22px}
.surface{background:var(--s1)}
.surface2{background:var(--s2)}

/* reveal motion (transform/opacity only) */
.rise{opacity:0;transform:translateY(26px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rise.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rise{opacity:1;transform:none;transition:none}}

/* lead form */
.lead-box{max-width:620px;margin:0 auto;background:var(--s1);padding:52px 48px}
.lead-box h2{font-size:clamp(30px,3.5vw,44px);margin-bottom:10px}
.lead-box .lead-sub{color:var(--ink2);margin-bottom:32px}
.field{margin-bottom:18px}
.field label{display:block;font-family:'Heebo';font-weight:600;font-size:14px;margin-bottom:8px;color:var(--ink)}
.field input,.field select,.field textarea{width:100%;background:var(--ground);border:1.5px solid var(--s3);border-radius:4px;padding:15px 16px;color:var(--ink);font-family:'Assistant';font-size:17px;transition:border-color .2s}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent)}
.lead-box .btn{width:100%;justify-content:center;font-size:19px;padding:18px;margin-top:6px}
.lead-alt{text-align:center;margin-top:18px;color:var(--ink3);font-size:15px}
.lead-alt a{color:var(--accent);font-weight:700}
.form-ok{display:none;text-align:center;padding:30px 6px}
.form-ok h3{font-size:28px;margin-bottom:10px}
.form-ok p{color:var(--ink2)}

/* footer */
.foot{border-top:1px solid var(--s2);padding:54px 0 40px}
.foot-in{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px}
.foot .mark{display:flex;align-items:center;gap:12px;font-family:'Heebo';font-weight:800;color:var(--ink)}
.foot .mark img{height:46px}
.foot .links{display:flex;gap:24px;font-family:'Heebo';font-weight:600;color:var(--ink2)}
.foot .links a:hover{color:var(--ink)}
.foot .copy{color:var(--ink3);font-size:14px;margin-top:28px;font-family:'Heebo'}
.foot .copy a{color:var(--ink3)}

/* whatsapp floating (kept — utility) */
.wa{position:fixed;bottom:26px;left:26px;z-index:60;width:58px;height:58px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center}
.wa svg{width:30px;height:30px;fill:#fff}

@media(max-width:900px){
  body{font-size:18px;background-attachment:scroll}
  .wrap{padding:0 22px}
  .nav .links{display:none}
  .hero{grid-template-columns:1fr;min-height:auto}
  .hero-text{padding:46px 22px 54px;order:2}
  .hero-img{order:1;height:52vh}
  .band{padding:88px 0}
  .band.tight{padding:64px 0}
  .lead-box{padding:36px 24px}
  .foot-in{flex-direction:column;text-align:center}
}

/* ============ CINEMATIC LAYER ============ */
/* film grain */
body::after{content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
/* custom cursor (desktop fine-pointer only) */
.cursor,.cursor-dot{position:fixed;top:0;left:0;z-index:95;pointer-events:none;border-radius:50%;transform:translate(-50%,-50%)}
.cursor{width:46px;height:46px;border:1.5px solid rgba(20,20,22,.42);transition:width .28s,height .28s,border-color .28s,background .28s,opacity .3s}
.cursor-dot{width:6px;height:6px;background:var(--accent)}
.cursor.grow{width:78px;height:78px;border-color:transparent;background:var(--accent);mix-blend-mode:normal}
.cursor .lbl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:'Heebo';font-weight:700;font-size:13px;color:var(--accent-ink);opacity:0;transition:opacity .25s}
.cursor.grow .lbl{opacity:1}
body.cursor-on,body.cursor-on a,body.cursor-on button,body.cursor-on .hub-col{cursor:none}
@media(hover:none),(pointer:coarse){.cursor,.cursor-dot{display:none!important}body.cursor-on *{cursor:auto}}
/* kinetic headline */
.kin{overflow:hidden}
.kin .ln{display:block;overflow:hidden}
.kin .ln i{display:inline-block;font-style:normal;transform:translateY(110%);transition:transform .9s cubic-bezier(.2,.8,.2,1)}
.kin.go .ln i{transform:none}
.kin .ln:nth-child(2) i{transition-delay:.12s}.kin .ln:nth-child(3) i{transition-delay:.24s}
/* mask reveal (clip wipe up) */
.rise.mask{opacity:1;transform:none;clip-path:inset(0 0 100% 0);transition:clip-path 1.05s cubic-bezier(.2,.8,.2,1)}
.rise.mask.in{clip-path:inset(0 0 0 0)}
/* image reveal */
.imgrev{overflow:hidden}
.imgrev img{transform:scale(1.14);transition:transform 1.3s cubic-bezier(.2,.8,.2,1)}
.imgrev.in img{transform:scale(1)}
/* cinemagraph hero */
.cine{position:relative;overflow:hidden;background:#000}
.cine .bg,.cine .fg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 16%}
.cine .bg{transform:scale(1.1);animation:kenb 20s ease-in-out infinite alternate}
@keyframes kenb{to{transform:scale(1.2) translate(-2%,-1.5%)}}
.cine .fg{z-index:2;will-change:transform;animation:floaty 7s ease-in-out infinite}
@keyframes floaty{0%,100%{transform:translate(0,0)}50%{transform:translate(0,-12px)}}
.cine .vig{position:absolute;inset:0;z-index:3;box-shadow:inset 0 -120px 160px -40px rgba(8,8,10,.9),inset 0 0 200px rgba(8,8,10,.4)}
.cine .sheen{position:absolute;top:0;bottom:0;width:40%;z-index:3;background:linear-gradient(100deg,transparent,rgba(255,255,255,.07),transparent);transform:skewX(-14deg);animation:sheen 7s ease-in-out infinite;left:-50%}
@keyframes sheen{0%,60%{left:-50%}100%{left:130%}}
@media(prefers-reduced-motion:reduce){.cine .bg,.cine .fg,.cine .sheen{animation:none}.kin .ln i{transform:none}}
/* testimonials marquee */
.marq{position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marq-track{display:flex;gap:16px;width:max-content;animation:marq 40s linear infinite}
.marq:hover .marq-track{animation-play-state:paused}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marq-card{flex:0 0 auto;width:300px;aspect-ratio:3/4;position:relative;overflow:hidden;background:#000;cursor:pointer}
.marq-card img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.marq-card:hover img{transform:scale(1.06)}
.marq-card .mt{position:absolute;right:0;bottom:0;left:0;padding:16px;background:rgba(10,10,13,.55)}
.marq-card .mt b{color:#fff;font-family:'Heebo';font-size:16px;display:block}.marq-card .mt span{color:rgba(255,255,255,.7);font-size:13px}
.marq-card .pl{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.marq-card .pl i{width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.9);display:flex;align-items:center;justify-content:center;font-style:normal;color:#111}
.marq-card .badge{position:absolute;top:10px;right:10px;background:rgba(10,10,13,.7);color:var(--accent);font-family:'Heebo';font-weight:700;font-size:11px;padding:4px 9px}
/* magnetic */
.magnetic{will-change:transform}