@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap');

:root{
  --black:#030404;
  --black2:#090b0c;
  --white:#f7f9f8;
  --red:#ff1f2d;
  --red2:#ff4651;
  --softred:#ff7a82;
  --muted:#8c9698;
  --line:rgba(255,255,255,.12);
  --darkline:rgba(0,0,0,.12);
  --display:'Nasalization','Poppins',Arial,sans-serif;
  --body:'Poppins',Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--black);color:var(--white);font-family:var(--body);overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E")}
a{color:inherit;text-decoration:none}
button{font:inherit}
::selection{background:var(--red);color:#fff}
.nav{height:74px;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid rgba(255,255,255,.08);background:rgba(3,4,4,.32);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.brand img{width:118px;height:auto;filter:brightness(0) invert(1);object-fit:contain}
.menu{position:absolute;left:50%;transform:translateX(-50%);width:42px;height:42px;border:1px solid rgba(255,255,255,.15);border-radius:50%;background:rgba(255,255,255,.03);display:grid;place-content:center;gap:5px;cursor:pointer}
.menu span{display:block;width:17px;height:1px;background:#fff;transition:.35s}
.menu:hover span:first-child{transform:translateX(3px);background:var(--red)}
.menu:hover span:last-child{transform:translateX(-3px);background:var(--red)}
.nav-cta{font-size:9px;letter-spacing:.14em;border:1px solid rgba(255,255,255,.45);padding:9px 12px;transition:.35s}
.nav-cta:hover{border-color:var(--red);color:var(--red);box-shadow:0 0 28px rgba(255,31,45,.12)}
.scroll-progress{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--red);transform-origin:left;transform:scaleX(0);z-index:100}
.dark{background:var(--black)}
.light{background:var(--white);color:#0a0c0d}
.hero{min-height:100svh;position:relative;padding:150px 7vw 35px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.hero:before{content:"";position:absolute;width:55vw;height:55vw;right:-22vw;top:10vh;border-radius:50%;background:radial-gradient(circle,rgba(255,31,45,.19),transparent 64%);filter:blur(20px);animation:orb 8s ease-in-out infinite alternate}
.hero:after,.work:after,.contact:after{content:"";position:absolute;inset:auto -10% -18% -10%;height:42%;background:radial-gradient(ellipse at center,rgba(255,31,45,.14),transparent 58%);filter:blur(30px);pointer-events:none}
@keyframes orb{to{transform:translate(-5vw,7vh) scale(1.18)}}
.hero-noise{position:absolute;inset:0;opacity:.08;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:70px 70px;mask-image:linear-gradient(to bottom,black,transparent 75%)}
.eyebrow,.section-label{font-size:8px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.hero-copy{max-width:900px;position:relative;z-index:2}
.hero h1{font-family:var(--display);font-weight:400;font-size:clamp(50px,8vw,116px);line-height:.9;letter-spacing:-.045em;margin:30px 0;overflow:hidden}
.hero h1 .line{display:block;transform:translateY(110%);opacity:0}
.hero h1 em,.work h2 em,.pricing h2 em,.contact h2 em{font-family:Georgia,'Times New Roman',serif;font-weight:400}
.hero-copy p{max-width:430px;font-size:12px;line-height:1.8;color:#aaa;opacity:0;transform:translateY(20px)}
.hero-art{display:flex;gap:5px;justify-content:flex-end;align-items:end;position:relative;z-index:2}
.art-tile{width:min(210px,24vw);aspect-ratio:1.2;background:linear-gradient(135deg,#ddd,#555);position:relative;overflow:hidden;padding:10px;color:#111;transform:translateY(40px);opacity:0}
.art-tile:before{content:"";position:absolute;inset:20% -20%;background:radial-gradient(circle at 30% 30%,#fff,transparent 18%),linear-gradient(120deg,transparent,#111,transparent);transform:rotate(-15deg);opacity:.7;animation:shimmer 7s linear infinite}
.art-tile:after{content:"";position:absolute;inset:-50%;background:linear-gradient(110deg,transparent 45%,rgba(255,31,45,.35),transparent 55%);transform:translateX(-70%) rotate(10deg);animation:sweep 5s ease-in-out infinite}
@keyframes shimmer{50%{transform:rotate(-15deg) translate(8%,4%)}}
@keyframes sweep{60%,100%{transform:translateX(70%) rotate(10deg)}}
.art-two{background:linear-gradient(145deg,#c7c7c7,#1b1b1b)}
.art-tile span,.art-tile b{position:relative;z-index:2;font-size:8px;letter-spacing:.15em}
.orange-tile{background:var(--red);width:min(160px,20vw);aspect-ratio:1.2;background:var(--red);padding:16px;color:#fff;font-size:10px;letter-spacing:.06em;position:relative;transform:translateY(40px);opacity:0;transition:.45s}
.orange-tile:hover{transform:translateY(-7px)!important;box-shadow:0 20px 70px rgba(255,31,45,.25)}
.orange-tile span{position:absolute;right:12px;top:9px;font-size:26px}
.hero-bottom{display:flex;gap:7vw;border-top:1px solid var(--line);padding-top:14px;color:#777;font-size:9px;text-transform:uppercase;letter-spacing:.12em;position:relative;z-index:2}
.hero-bottom span{opacity:0;transform:translateY(10px)}
.intro{padding:140px 7vw 110px}
.intro-grid{display:grid;grid-template-columns:24% 1fr;gap:8vw;margin:70px 0 45px}
.side-note{font-size:8px;line-height:1.7;color:#888;text-transform:uppercase}
.intro h2{max-width:850px;font-family:var(--display);font-size:clamp(35px,4.5vw,68px);line-height:1.08;font-weight:400;letter-spacing:-.04em;margin:0}
.intro h2 strong{font-weight:600}
.feature-visual{margin-left:22%;height:min(55vw,560px);background:linear-gradient(125deg,#ddd,#f9f9f7);position:relative;overflow:hidden;transform:translateY(40px);opacity:0;transition:transform 1s cubic-bezier(.16,1,.3,1),opacity 1s}
.feature-visual.revealed{transform:none;opacity:1}
.visual-window{position:absolute;inset:0;background:radial-gradient(circle at 65% 35%,#fff 0 12%,transparent 13%),linear-gradient(115deg,transparent 30%,rgba(0,0,0,.08) 31%,transparent 55%);display:flex;align-items:center;justify-content:center}
.window-shape{width:34%;height:65%;border-radius:50% 50% 4% 4%;background:linear-gradient(145deg,#2b2b2b,#c8c8c8);box-shadow:50px 30px 0 -10px #efefef;transform:translateY(var(--parallax,0px))}
.window-copy{font-family:var(--display);font-size:clamp(25px,4vw,55px);line-height:.9;letter-spacing:-.04em;position:relative;z-index:2;margin-left:-13%;color:#fff;text-shadow:0 1px 20px #333}
.floating-dot{position:absolute;width:100px;height:100px;border-radius:50%;background:var(--red);right:10%;bottom:10%;filter:blur(1px);opacity:.75;animation:float 4s ease-in-out infinite}
@keyframes float{50%{transform:translate(-18px,-20px) scale(1.08)}}
.services{padding:60px 7vw 140px;display:grid;grid-template-columns:1.05fr 1fr;gap:8vw}
.services-list{padding-top:20px}
.service{font-family:var(--display);font-size:clamp(30px,4vw,58px);padding:18px 0;border-bottom:1px solid #d8d8d4;letter-spacing:-.04em;transition:.45s cubic-bezier(.16,1,.3,1);cursor:pointer}
.service span{font-size:8px;vertical-align:top;margin-right:20px;color:#999}
.service small{font-size:13px;float:right;transition:.4s}
.service.active,.service:hover{padding-left:14px;color:#111}
.service.active small,.service:hover small{color:var(--red);transform:translate(5px,-5px)}
.service-feature{padding-top:20px}
.product-card{height:420px;background:#ddd;position:relative;overflow:hidden;margin-bottom:25px;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.product-card:hover{transform:scale(.985)}
.pack{position:absolute;box-shadow:0 25px 35px rgba(0,0,0,.15);background:linear-gradient(135deg,#fff,#ddd);transition:transform .8s cubic-bezier(.16,1,.3,1)}
.product-card:hover .pack-a{transform:rotate(-14deg) translate(-12px,-15px)}
.product-card:hover .pack-b{transform:rotate(7deg) translate(4px,-22px)}
.product-card:hover .pack-c{transform:rotate(18deg) translate(12px,-10px)}
.pack-a{width:190px;height:250px;left:12%;top:22%;transform:rotate(-14deg)}
.pack-b{width:170px;height:270px;left:40%;top:15%;transform:rotate(7deg)}
.pack-c{width:180px;height:240px;right:8%;top:28%;transform:rotate(18deg)}
.product-card:after{content:"HEYGENCY.";position:absolute;left:20px;bottom:20px;font-family:var(--display);font-size:30px}
.service-feature p{font-size:11px;line-height:1.6;max-width:460px;color:#666}
.mini-links{font-size:8px;letter-spacing:.12em;margin-top:25px;color:#444}
.work{position:relative;padding:135px 7vw 160px;overflow:hidden}
.work-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin:80px 0 70px}
.work h2{font-family:var(--display);font-size:clamp(40px,6vw,82px);font-weight:400;line-height:.92;letter-spacing:-.05em;margin:0}
.work-heading p{max-width:280px;color:#888;font-size:10px;line-height:1.6}
.work-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px 9vw;align-items:start}
.project{position:relative;opacity:0;transform:translateY(70px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.project.revealed{opacity:1;transform:none}
.project:nth-child(3){margin-top:-30px}
.project:nth-child(4){margin-top:30px}
.project:nth-child(5){grid-column:2;margin-top:-20px}
.project-art{background:#ecece8;aspect-ratio:1.18;position:relative;overflow:hidden;transition:transform .8s cubic-bezier(.16,1,.3,1)}
.project:hover .project-art{transform:scale(.975)}
.project-art:after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,rgba(255,31,45,.14),transparent 65%);transform:translateX(-100%);transition:1s}
.project:hover .project-art:after{transform:translateX(100%)}
.dots{background-color:#eee;background-image:radial-gradient(circle,#555 0 9%,transparent 10%);background-size:35px 35px;filter:blur(1.2px)}
.app{display:grid;place-items:center;background:linear-gradient(145deg,#eee,#b9b9b9)}
.phone{width:42%;aspect-ratio:.52;border-radius:24px;background:#111;padding:9px;box-shadow:0 25px 45px rgba(0,0,0,.35);transform:rotate(9deg);transition:.7s}
.project:hover .phone{transform:rotate(3deg) translateY(-12px)}
.phone-screen{height:100%;border-radius:17px;background:linear-gradient(160deg,#aeeeff,#111);display:grid;place-items:center;font-family:var(--display);font-size:24px;text-align:center}
.ecommerce{display:grid;place-items:center;background:linear-gradient(135deg,#ddd,#fff)}
.browser{width:65%;height:70%;background:#151515;color:#fff;padding:25px;font-family:var(--display);font-size:28px;line-height:.9;box-shadow:15px 20px 40px rgba(0,0,0,.25);transition:.7s}
.project:hover .browser{transform:translateY(-12px) rotate(-2deg);box-shadow:20px 30px 55px rgba(255,31,45,.12)}
.cards{background:#e8e8e6;display:flex;align-items:center;justify-content:center;gap:0}
.cards div{width:35%;height:55%;background:#fff;box-shadow:0 18px 30px rgba(0,0,0,.2);transform:rotate(-8deg);transition:.7s}
.project:hover .cards div:nth-child(1){transform:rotate(-13deg) translate(-10px,-10px)}
.project:hover .cards div:nth-child(2){transform:rotate(4deg) translateY(-20px)}
.project:hover .cards div:nth-child(3){transform:rotate(18deg) translate(10px,-8px)}
.cards div:nth-child(2){transform:rotate(4deg);margin-left:-15%}
.cards div:nth-child(3){transform:rotate(13deg);margin-left:-15%}
.kinetic{background:linear-gradient(135deg,#ddd,#fafafa);display:grid;place-items:center;font-family:var(--display);font-size:70px;color:#111}
.kinetic i{position:absolute;right:18%;top:18%;font-style:normal;font-size:35px;transition:.6s}
.project:hover .kinetic i{transform:rotate(45deg) scale(1.2);color:var(--red)}
.project h3{font-family:var(--display);font-size:18px;font-weight:400;margin:16px 0 6px}
.project p{font-size:9px;color:#888;max-width:330px;line-height:1.5;margin:0 0 12px}
.project>span{font-size:7px;letter-spacing:.15em;color:#aaa}
.testimonial{padding:120px 7vw 140px;position:relative}
.quote-mark{font-family:Georgia;font-size:100px;line-height:.6;color:var(--red)}
blockquote{max-width:760px;margin:20px 0 30px 12%;font-family:var(--display);font-size:clamp(30px,4vw,58px);line-height:1.05;letter-spacing:-.045em}
.quote-author{margin-left:12%;display:flex;align-items:center;gap:15px;font-size:10px}
.quote-author span{color:#999}
.avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(145deg,#ddd,#555)}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;border-top:1px solid #d7d7d2;margin-top:110px;padding-top:35px}
.stats b{font-family:var(--display);font-size:clamp(32px,4vw,58px);font-weight:400}
.stats span{display:block;font-size:7px;letter-spacing:.12em;color:#999;margin-top:8px}
.pricing{padding:90px 7vw 140px}
.pricing-head{display:flex;justify-content:space-between;align-items:end;margin:65px 0 55px}
.pricing h2{font-family:var(--display);font-size:clamp(36px,5vw,65px);line-height:1;letter-spacing:-.05em;font-weight:400;margin:0}
.pricing-head p{max-width:260px;font-size:10px;line-height:1.6;color:#777}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.price-card{border:1px solid #cfcfca;padding:30px;min-height:390px;display:flex;flex-direction:column;transition:.45s}
.price-card:hover{transform:translateY(-10px);border-color:var(--red);box-shadow:0 20px 60px rgba(255,31,45,.08)}
.price-card.featured{background:#111;color:#fff;border-color:#111}
.price-card>span{font-size:8px;letter-spacing:.16em}
.price-card strong{font-family:var(--display);font-size:42px;font-weight:400;margin:45px 0 18px}
.price-card p{font-size:10px;color:#777;line-height:1.5;min-height:45px}
.price-card.featured p{color:#aaa}
.price-card ul{padding:0;list-style:none;font-size:9px;line-height:2.1;color:#777}
.price-card.featured ul{color:#bbb}
.price-card a{margin-top:auto;border:1px solid currentColor;padding:13px;text-align:center;font-size:8px;letter-spacing:.12em;transition:.35s}
.price-card a:hover{background:var(--red);border-color:var(--red);color:#fff}
.contact{position:relative;padding:130px 7vw 35px;overflow:hidden}
.contact:before{content:"";position:absolute;width:45vw;height:45vw;right:-15vw;top:5vh;background:radial-gradient(circle,rgba(255,31,45,.15),transparent 65%);filter:blur(15px);animation:orb 9s ease-in-out infinite alternate}
.contact-top{min-height:55vh;display:flex;flex-direction:column;justify-content:space-between;position:relative;z-index:2}
.contact h2{font-family:var(--display);font-size:clamp(55px,9vw,125px);font-weight:400;line-height:.85;letter-spacing:-.06em;margin:0}
.email{font-family:var(--display);font-size:clamp(28px,5vw,70px);display:inline-block;border-bottom:1px solid #444;padding-bottom:8px;margin:30px 0 110px;transition:.4s}
.email:hover{color:var(--red);border-color:var(--red)}
.email span{font-family:Arial;font-size:.6em}
.contact-footer{border-top:1px solid var(--line);padding-top:22px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:30px;color:#777;font-size:8px;letter-spacing:.12em}
.contact-footer b{font-family:var(--display);font-size:20px;color:#fff;font-weight:400;letter-spacing:0}
.contact-footer small{font-size:7px}
.contact-footer div:nth-child(2),.contact-footer div:nth-child(3){display:flex;gap:20px;justify-content:flex-end;align-items:flex-start;flex-wrap:wrap}
.cursor{position:fixed;z-index:100;width:9px;height:9px;border:1px solid var(--red);border-radius:50%;pointer-events:none;mix-blend-mode:difference;transform:translate(-50%,-50%);transition:width .2s,height .2s,background .2s}
.reveal{opacity:0;transform:translateY(55px);transition:opacity .9s cubic-bezier(.16,1,.3,1),transform .9s cubic-bezier(.16,1,.3,1)}
.reveal.revealed{opacity:1;transform:none}
.cyan-line{height:1px;background:var(--red);width:0;transition:width 1.2s cubic-bezier(.16,1,.3,1)}
.cyan-line.revealed{width:100%}

/* ===== Recent Posters & Videos ===== */
.recent{
  background:#050505;
  color:#fff;
  position:relative;
  overflow:hidden;
  padding:130px 0 150px;
}
.recent:before{
  content:"";
  position:absolute;
  width:55vw;height:55vw;
  left:-30vw;top:5%;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,31,45,.18),transparent 66%);
  filter:blur(25px);
}
.recent-head{
  padding:0 7vw;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:40px;
  position:relative;
  z-index:2;
}
.recent-title{
  font-family:var(--display);
  font-size:clamp(45px,7vw,100px);
  font-weight:400;
  line-height:.86;
  letter-spacing:-.055em;
  margin:25px 0 0;
}
.recent-title em{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
}
.recent-description{
  max-width:280px;
  color:#888;
  font-size:10px;
  line-height:1.7;
}
.recent-filter{
  display:flex;
  gap:8px;
  margin-top:45px;
  padding:0 7vw;
  position:relative;
  z-index:2;
}
.recent-filter button{
  border:1px solid #292929;
  color:#aaa;
  background:transparent;
  padding:9px 14px;
  border-radius:999px;
  font-size:8px;
  letter-spacing:.13em;
  cursor:pointer;
  transition:.35s;
}
.recent-filter button.active,
.recent-filter button:hover{
  color:#fff;
  border-color:var(--red);
  background:var(--red);
}
.recent-track-wrap{
  margin-top:55px;
  overflow:hidden;
  cursor:grab;
  position:relative;
  z-index:2;
}
.recent-track-wrap:active{cursor:grabbing}
.recent-track{
  display:flex;
  gap:18px;
  width:max-content;
  padding-left:7vw;
  will-change:transform;
}
.media-card{
  width:min(35vw,500px);
  min-width:290px;
  position:relative;
  flex:none;
}
.media-visual{
  aspect-ratio:4/5;
  background:#111;
  position:relative;
  overflow:hidden;
  border:1px solid #202020;
  transition:transform .7s cubic-bezier(.16,1,.3,1),border-color .4s;
}
.media-card:hover .media-visual{
  transform:scale(.975);
  border-color:rgba(255,31,45,.7);
}
.media-visual:after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(115deg,transparent 25%,rgba(255,31,45,.35),transparent 60%);
  transform:translateX(-130%);
  transition:1s;
}
.media-card:hover .media-visual:after{transform:translateX(130%)}
.poster-art{
  width:100%;height:100%;
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 75% 22%,rgba(255,255,255,.9) 0 2%,transparent 3%),
    linear-gradient(145deg,#111 0 45%,#e50920 46% 65%,#fff 66%);
}
.poster-art.two{
  background:
    radial-gradient(circle at 30% 30%,#fff 0 8%,transparent 9%),
    linear-gradient(125deg,#050505 0 45%,#ff1f2d 46% 70%,#171717 71%);
}
.poster-art.three{
  background:
    linear-gradient(180deg,transparent 0 58%,#fff 59%),
    repeating-linear-gradient(120deg,#050505 0 22px,#ff1f2d 23px 42px);
}
.poster-copy{
  position:absolute;
  inset:25px;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.poster-copy small{font-size:7px;letter-spacing:.2em}
.poster-copy strong{
  font-family:var(--display);
  font-size:clamp(32px,4vw,62px);
  font-weight:400;
  line-height:.82;
  letter-spacing:-.045em;
}
.poster-copy span{font-size:8px;letter-spacing:.15em}
.video-art{
  width:100%;height:100%;
  background:
    linear-gradient(135deg,rgba(255,31,45,.9),transparent 42%),
    radial-gradient(circle at 70% 45%,#555,transparent 22%),
    linear-gradient(145deg,#171717,#050505);
  position:absolute;inset:0;
}
.video-art:before{
  content:"";
  position:absolute;
  width:55%;height:75%;
  left:24%;top:12%;
  background:linear-gradient(145deg,#222,#888 40%,#111);
  transform:rotate(-8deg);
  box-shadow:30px 30px 80px rgba(0,0,0,.7);
}
.play{
  width:72px;height:72px;border-radius:50%;
  position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);
  background:#fff;color:#111;
  display:grid;place-items:center;
  z-index:3;
  font-size:17px;
  transition:.4s;
}
.media-card:hover .play{
  background:var(--red);color:#fff;
  transform:translate(-50%,-50%) scale(1.12);
}
.media-meta{
  display:flex;
  justify-content:space-between;
  gap:15px;
  padding-top:15px;
}
.media-meta h3{
  font-family:var(--display);
  font-size:15px;
  font-weight:400;
  margin:0;
}
.media-meta p{
  color:#777;
  font-size:8px;
  line-height:1.5;
  max-width:190px;
  margin:3px 0 0;
}
.media-tag{
  color:#888;
  font-size:7px;
  letter-spacing:.15em;
  white-space:nowrap;
}
.recent-bottom{
  margin:70px 7vw 0;
  display:flex;
  justify-content:space-between;
  border-top:1px solid #222;
  padding-top:20px;
  color:#666;
  font-size:8px;
  letter-spacing:.12em;
}
.recent-bottom strong{color:#fff;font-weight:400}
@media(max-width:800px){
  .recent-head{display:block}
  .recent-description{margin-top:25px}
  .recent-filter{overflow:auto;white-space:nowrap;padding-right:5vw}
  .recent-track{padding-left:5vw}
  .media-card{width:78vw;min-width:78vw}
  .recent-bottom{margin-left:5vw;margin-right:5vw}
}

@media(max-width:800px){
  .nav{padding:0 5vw}.hero{padding:125px 5vw 25px}.hero h1{font-size:17vw}.hero-art{justify-content:flex-start}.art-tile{width:28vw}.orange-tile{background:var(--red);width:25vw}
  .intro,.services,.work,.testimonial,.pricing,.contact{padding-left:5vw;padding-right:5vw}
  .intro-grid,.services{grid-template-columns:1fr;gap:45px}.feature-visual{margin-left:0;height:70vw}
  .work-heading,.pricing-head{display:block}.work-heading p,.pricing-head p{margin-top:25px}
  .work-grid{grid-template-columns:1fr;gap:60px}.project:nth-child(3),.project:nth-child(4),.project:nth-child(5){margin-top:0}.project:nth-child(5){grid-column:auto}
  blockquote,.quote-author{margin-left:0}.stats{grid-template-columns:1fr 1fr}
  .price-grid{grid-template-columns:1fr}.price-card{min-height:330px}
  .contact-top{min-height:65vh}.contact-footer{grid-template-columns:1fr}.contact-footer div:nth-child(2),.contact-footer div:nth-child(3){justify-content:flex-start}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .cursor{display:none}
}


/* ===== Strategic CTA / positioning content ===== */
.hero-ctas{
  display:flex;
  gap:12px;
  align-items:center;
  margin-top:32px;
  opacity:0;
  transform:translateY(18px);
  animation:heroCtaIn .9s .95s cubic-bezier(.16,1,.3,1) forwards;
}
@keyframes heroCtaIn{to{opacity:1;transform:none}}
.cta-primary,.cta-secondary,.inline-cta,.final-button,.strategy-cta a,.statement-cta a{
  display:inline-flex;
  align-items:center;
  gap:22px;
  font-size:8px;
  letter-spacing:.14em;
  transition:.4s cubic-bezier(.16,1,.3,1);
}
.cta-primary{
  background:var(--red);
  color:#fff;
  padding:15px 18px;
  border:1px solid var(--red);
}
.cta-primary:hover{transform:translateY(-4px);box-shadow:0 15px 45px rgba(255,31,45,.2)}
.cta-primary span,.cta-secondary span,.inline-cta span,.final-button span,.strategy-cta a span,.statement-cta a span{font-size:16px}
.cta-secondary{padding:14px 4px;color:#aaa;border-bottom:1px solid #444}
.cta-secondary:hover{color:#fff;border-color:var(--red)}
.inline-cta{
  margin-top:22px;
  border-bottom:1px solid #aaa;
  padding-bottom:9px;
  color:#111;
}
.inline-cta:hover{color:var(--red);border-color:var(--red)}
.statement-cta{
  margin:80px 0 0 12%;
  padding:35px 0;
  border-top:1px solid #d7d7d2;
  border-bottom:1px solid #d7d7d2;
  display:grid;
  grid-template-columns:20% 1fr auto;
  align-items:center;
  gap:35px;
}
.statement-cta span{font-size:7px;letter-spacing:.16em;color:#999}
.statement-cta strong{
  font-family:var(--display);
  font-size:clamp(22px,3vw,42px);
  line-height:1;
  font-weight:400;
  letter-spacing:-.04em;
}
.statement-cta a{color:#111;border-bottom:1px solid #111;padding-bottom:8px}
.statement-cta a:hover{color:var(--red);border-color:var(--red)}
.strategy{
  padding:135px 7vw 145px;
  position:relative;
  overflow:hidden;
}
.strategy:before{
  content:"";
  position:absolute;
  width:40vw;height:40vw;
  right:-20vw;top:-15vw;
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,31,45,.12),transparent 68%);
  filter:blur(25px);
}
.strategy-intro{
  display:grid;
  grid-template-columns:1fr .65fr;
  gap:9vw;
  align-items:end;
  margin:70px 0 80px;
  position:relative;
}
.strategy-intro h2{
  font-family:var(--display);
  font-size:clamp(48px,6vw,90px);
  font-weight:400;
  line-height:.88;
  letter-spacing:-.055em;
  margin:0;
}
.strategy-intro h2 em{
  font-family:Georgia,'Times New Roman',serif;
  font-weight:400;
}
.strategy-intro p{
  color:#777;
  font-size:11px;
  line-height:1.8;
  max-width:360px;
}
.strategy-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid #d5d5d0;
  border-bottom:1px solid #d5d5d0;
  position:relative;
}
.strategy-grid article{
  padding:35px 30px 45px 0;
  border-right:1px solid #d5d5d0;
  transition:.45s;
}
.strategy-grid article:not(:first-child){padding-left:30px}
.strategy-grid article:last-child{border-right:0}
.strategy-grid article:hover{background:#f0f0ed}
.strategy-grid span{font-size:8px;color:var(--red)}
.strategy-grid h3{
  font-family:var(--display);
  font-size:26px;
  font-weight:400;
  margin:55px 0 15px;
  letter-spacing:-.03em;
}
.strategy-grid p{font-size:10px;color:#777;line-height:1.7;max-width:280px}
.strategy-cta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:50px;
  position:relative;
}
.strategy-cta p{
  font-family:var(--display);
  font-size:20px;
  margin:0;
}
.strategy-cta a{color:#111;border-bottom:1px solid #111;padding-bottom:9px}
.strategy-cta a:hover{color:var(--red);border-color:var(--red)}
.final-cta-copy{
  max-width:570px;
  color:#888;
  font-size:12px;
  line-height:1.8;
  margin-top:35px;
}
.final-button{
  border:1px solid #444;
  padding:15px 20px;
  margin-bottom:40px;
}
.final-button:hover{background:var(--red);border-color:var(--red);transform:translateY(-4px)}
@media(max-width:800px){
  .hero-ctas{flex-wrap:wrap}
  .statement-cta{margin-left:0;grid-template-columns:1fr;gap:20px}
  .strategy-intro{grid-template-columns:1fr;gap:30px}
  .strategy-grid{grid-template-columns:1fr}
  .strategy-grid article,.strategy-grid article:not(:first-child){padding:30px 0;border-right:0;border-bottom:1px solid #d5d5d0}
  .strategy-grid article:last-child{border-bottom:0}
  .strategy-grid h3{margin-top:35px}
  .strategy-cta{display:block}
  .strategy-cta a{margin-top:25px}
}


/* ===== Real media cards / lazy YouTube ===== */
.media-image img,.video-card>img,.image-feature>img,.image-project img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform 1s cubic-bezier(.16,1,.3,1),filter .7s;
}
.media-image img{filter:saturate(.78) contrast(1.05)}
.media-card:hover .media-image img{transform:scale(1.055);filter:saturate(1) contrast(1.08)}
.image-overlay{
  position:absolute;
  inset:0;
  z-index:2;
  padding:20px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  color:#fff;
  background:linear-gradient(180deg,rgba(0,0,0,.35),transparent 35%,rgba(0,0,0,.62));
}
.image-overlay span{font-size:9px}
.image-overlay b{font-family:var(--display);font-size:clamp(25px,3.4vw,48px);font-weight:400;letter-spacing:-.04em}
.video-card{background:#111}
.video-card>img{filter:brightness(.72) contrast(1.08)}
.video-card:before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(145deg,rgba(255,31,45,.3),transparent 45%,rgba(0,0,0,.5));
}
.video-card:hover>img{transform:scale(1.04);filter:brightness(.82) contrast(1.1)}
.play-video{
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  z-index:4;
  width:78px;height:78px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.75);
  background:rgba(255,255,255,.94);
  color:#111;
  display:grid;
  place-items:center;
  cursor:pointer;
  transition:.45s cubic-bezier(.16,1,.3,1);
}
.play-video span{margin-left:3px;font-size:16px}
.play-video:hover{background:var(--red);color:#fff;border-color:var(--red);transform:translate(-50%,-50%) scale(1.12)}
.video-badge{
  position:absolute;
  z-index:4;
  top:18px;right:18px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.35);
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(8px);
  font-size:7px;
  letter-spacing:.13em;
}
.video-card iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
.image-feature{position:relative;background:#111}
.image-feature>img{filter:grayscale(.15) contrast(1.05)}
.feature-shade{position:absolute;inset:0;background:linear-gradient(110deg,rgba(0,0,0,.55),transparent 65%)}
.image-feature .window-copy{margin:0 0 0 7%;font-size:clamp(35px,5vw,70px)}
.image-project{background:#111}
.image-project:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,31,45,.15),transparent 55%);z-index:1}
.image-project img{filter:grayscale(.25) contrast(1.05);opacity:.9}
.project:hover .image-project img{transform:scale(1.06);filter:grayscale(0) contrast(1.08)}
.image-project-label{
  position:absolute;
  z-index:3;
  left:20px;bottom:20px;
  color:#fff;
  font-size:8px;
  letter-spacing:.15em;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.4);
  background:rgba(0,0,0,.35);
  backdrop-filter:blur(8px);
}
