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

@media (min-width:761px){
  body{font-family:'Montserrat',Arial,Helvetica,sans-serif;background:#032331}
  .header{height:60px;background:#031d29}
  .nav{height:60px;gap:18px}
  .container{width:calc(100% - 66px);max-width:1476px}
  .brand img{width:270px;height:56px}
  .menu{gap:25px;font-size:13px;height:60px}
  .menu a{padding:21px 0}
  .menu a.active:after{bottom:8px}
  .menu .btn{padding:10px 16px;font-size:12px;margin-left:4px}
  .page-hero{height:342px;padding:50px 0 42px;background:linear-gradient(135deg,#062a3a,#031d29)}
  .page-hero .container{position:relative;z-index:2}
  .page-hero:after{right:-55px;top:-105px;width:590px;height:430px;opacity:.72}
  .page-hero .eyebrow{font-size:12px;letter-spacing:.06em;margin-bottom:4px}
  .page-hero h1{font-size:40px;line-height:1.04;letter-spacing:-.02em;margin:10px 0 17px;max-width:620px}
  .page-hero p{font-size:14px;line-height:1.55;max-width:610px;color:#f0f2f3}
  .page-hero + .section{padding:24px 0 20px;height:273px}
  .about-split{grid-template-columns:1fr 1fr;gap:48px;height:100%}
  .about-split img{width:100%;height:240px;object-fit:cover;border-radius:3px}
  .about-split .eyebrow{font-size:12px}
  .about-split h2{font-size:31px;line-height:1.12;margin:10px 0 15px}
  .about-split p{font-size:14px;line-height:1.55;margin:0;color:#f0f2f3}
  .page-hero + .section + .section{height:190px;padding:20px 0 15px}
  .values{grid-template-columns:repeat(4,1fr);height:100%}
  .value{padding:5px 25px;border-right:1px solid rgba(246,185,26,.35)}
  .value .icon{font-size:38px;line-height:1.05;height:43px;color:var(--gold)}
  .value h3{font-size:18px;margin:6px 0 5px}
  .value p{font-size:13px;line-height:1.5;margin:0;color:#f0f2f3}
  .page-hero + .section + .section + .section{height:325px;padding:24px 0}
  .page-hero + .section + .section + .section .about-split{grid-template-columns:1.15fr 1fr 1fr;gap:16px}
  .page-hero + .section + .section + .section .about-split > div{grid-column:1}
  .page-hero + .section + .section + .section .about-split > img{grid-column:2;height:282px}
  .page-hero + .section + .section + .section .about-split:after{content:'„Dobře navržený\A a kvalitně realizovaný\A prostor zlepšuje život\A lidem. A to nás baví.“\A\A FORTHEA s.r.o.';white-space:pre;grid-column:3;height:282px;border:1px solid rgba(255,255,255,.18);border-radius:3px;padding:28px 22px;color:#f0f2f3;font-size:15px;line-height:1.45;display:flex;align-items:center;background:rgba(255,255,255,.015)}
  .page-hero + .section + .section + .section .about-split h2{font-size:29px}
  .page-hero + .section + .section + .section .about-split p{font-size:14px;line-height:1.55}
  .cta{height:138px;padding:0;background:linear-gradient(90deg,#07364a,#062939);display:flex;align-items:center;position:relative;overflow:hidden}
  .cta:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(3,35,49,.82),rgba(3,35,49,.24)),url('assets/cta-approved-clean.jpg') center/cover;opacity:1}
  .cta-inner{position:relative;z-index:1;min-height:138px}
  .cta h2{font-size:21px;line-height:1.2;margin:0;max-width:610px}
  .cta .btn{font-size:11px;padding:12px 20px}
  .contact-strip{height:96px}
  .contact-grid{height:100%;grid-template-columns:repeat(4,1fr)}
  .contact-item{padding:12px 18px;gap:10px}
  .contact-icon{font-size:23px}
  .contact-item b{font-size:11px}
  .contact-item small{font-size:8px}
  .footer{height:92px;padding:0;display:flex;align-items:center;font-size:9px}
  .footer-inner{width:calc(100% - 66px);max-width:1476px;margin:auto}
}
@media (min-width:761px) and (max-height:900px){
  .page-hero{height:300px;padding-top:38px}
  .page-hero + .section{height:235px;padding-top:18px}
  .about-split img{height:205px}
  .page-hero + .section + .section{height:155px;padding-top:12px}
  .page-hero + .section + .section + .section{height:275px;padding-top:18px}
  .page-hero + .section + .section + .section .about-split > img,.page-hero + .section + .section + .section .about-split:after{height:235px}
  .cta{height:105px}.cta-inner{min-height:105px}.contact-strip{height:80px}.footer{height:70px}
}
