/* Portrait tablets use the phone campaign hierarchy, regardless of input device.
   Content defines the height: Safari's changing toolbar cannot center it lower. */
@media (min-width:761px) and (max-width:1180px) and (orientation:portrait) {
  body:has(.hero) .header{height:clamp(84px,11vw,112px);padding-inline:4.5%;gap:20px}
  body:has(.hero) .header .brand{flex-direction:column;align-items:flex-start;gap:5px;flex-shrink:0}
  body:has(.hero) .header .brand>span{font-size:clamp(38px,5.3vw,56px);line-height:1.05}
  body:has(.hero) .header .brand small{display:block;font-size:clamp(10px,1.3vw,14px);letter-spacing:.22em}
  body:has(.hero) .desktop-nav{display:none}
  body:has(.hero) .header-tools{gap:12px;font-size:18px;flex-shrink:0}
  body:has(.hero) .menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:8px;width:48px;height:48px;margin-left:12px;padding:8px}
  body:has(.hero) .menu-toggle span{display:block;width:32px;height:2px;background:currentColor}
  body:has(.hero) .menu-toggle[aria-expanded=true] span:first-child{transform:translateY(5px) rotate(45deg)}
  body:has(.hero) .menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-5px) rotate(-45deg)}
  .hero{display:grid;grid-template-columns:minmax(0,56%) minmax(0,44%);grid-template-rows:repeat(6,auto);align-items:start;align-content:start;gap:clamp(10px,1.4vw,16px) 0;height:auto;min-height:0;max-height:none;padding:22px 4.5% 32px;overflow:hidden;clip-path:none}
  .hero .hero-copy,.hero .headline-top{display:contents}
  .hero .why{grid-column:1;grid-row:1;align-self:start;justify-self:start;width:auto;font-size:clamp(170px,23vw,250px);line-height:1;letter-spacing:-.04em}
  .hero .why::after{right:-8%;bottom:0;height:.045em}
  .hero h1{grid-column:1;grid-row:2;margin:0;width:auto;font-size:clamp(100px,13.3vw,150px);line-height:1.08;letter-spacing:-.04em;white-space:nowrap}
  .hero .edition{grid-column:1;grid-row:3;align-self:start;justify-content:flex-start;margin:10px 0 0;gap:8px}
  .hero .edition b{font-size:clamp(82px,11vw,118px);line-height:1}
  .hero .edition span{font-size:clamp(11px,1.4vw,15px)}
  .hero h2,html[lang=en] .hero h2{grid-column:1;grid-row:4;width:auto;margin:8px 0 0;font-size:clamp(30px,4.2vw,46px);line-height:1.5;letter-spacing:-.035em}
  .hero h2 span{display:block;white-space:nowrap}
  .hero .hero-intro-row{grid-column:1;grid-row:5;align-self:start;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;width:100%;min-height:0;margin:10px 0 0;gap:20px}
  .hero-intro-row .hero-intro{flex:none;font-size:clamp(16px,2vw,23px);line-height:1.75}
  .hero-intro>span{white-space:nowrap}
  .hero .film-button{padding:0;gap:12px;font-size:clamp(18px,2.2vw,24px);min-height:48px}
  .hero .play-icon{width:clamp(44px,5.6vw,60px);height:clamp(44px,5.6vw,60px)}
  .hero .hero-visual{position:relative;grid-column:2;grid-row:1/6;align-self:stretch;justify-self:center;top:auto;right:auto;bottom:auto;width:185%;height:auto;min-height:0;margin:0;aspect-ratio:auto;z-index:1}
  .hero .hero-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center bottom}
  .hero .why,.hero h1,.hero .edition,.hero h2,.hero .hero-intro-row,.hero .hero-actions{position:relative;z-index:2}
  .hero .hero-actions{grid-column:1/-1;grid-row:6;display:flex;flex-direction:column;align-self:start;width:100%;max-width:none;margin:20px 0 0;gap:12px}
  .hero .hero-actions .hero-cta{position:relative;flex:none;justify-content:center;width:100%;min-width:0;min-height:clamp(60px,7.7vw,82px);padding:16px 60px;gap:0}
  .hero .hero-actions .cta-copy{width:100%;min-width:0;align-items:center;text-align:center}
  .hero .hero-actions .cta-copy>span,html[lang=en] .hero .founder-cta .cta-copy>span{font-size:clamp(18px,2.35vw,26px);line-height:1.4;white-space:nowrap}
  .hero .hero-actions .cta-symbol{position:absolute;right:24px;top:50%;transform:translateY(-50%);width:30px;height:30px;font-size:30px}
  .hero .hero-actions .cta-symbol svg{width:24px;height:24px}
  .hero .hero-actions .hero-cta:hover .cta-symbol{transform:translate(2px,-50%)}
  html[lang=en] .hero h2{font-size:clamp(28px,3.9vw,43px)}
  html[lang=en] .hero-intro-row .hero-intro{font-size:clamp(15px,1.8vw,21px)}
}