/* ============================================
   GF promotions — Tactical Gold
   Dark premium · glassmorphism · gold accent
   ============================================ */

:root{
  /* surfaces */
  --bg:        #0A0C10;
  --bg-2:      #0E1117;
  --surface:   #14181F;
  --glass:     rgba(255,255,255,.045);
  --glass-2:   rgba(255,255,255,.07);
  --border:    rgba(255,255,255,.10);
  --border-2:  rgba(255,255,255,.06);

  /* text */
  --text:      #F4F6F8;
  --muted:     #9AA4B2;
  --muted-2:   #6B7480;

  /* accents */
  --gold:      #F0B429;
  --gold-2:    #E0A82E;
  --gold-soft: rgba(240,180,41,.12);
  --red:       #D72638;

  /* type */
  --display: "Space Grotesk", system-ui, sans-serif;
  --body:    "Inter", system-ui, sans-serif;
  --mono:    "JetBrains Mono", monospace;

  /* layout */
  --radius:   18px;
  --radius-sm:12px;
  --maxw:     1180px;
  --nav-h:    72px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

*{ margin:0; padding:0; box-sizing:border-box; }

::selection{ background:var(--gold); color:#0A0C10; }

html{ scroll-behavior:smooth; scroll-padding-top:var(--nav-h); }

body{
  font-family:var(--body);
  background:var(--bg);
  color:var(--text);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.menu-open{ overflow:hidden; }
body.menu-open .nav{ background:var(--bg); border-bottom-color:var(--border-2); }

img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:24px; }

/* ---------- typography helpers ---------- */
.eyebrow{
  font-family:var(--mono);
  font-size:.72rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:14px;
}
.accent{ color:var(--gold); }

.section{ padding:clamp(64px,9vw,120px) 0; position:relative; }

.section__head{ max-width:640px; margin:0 auto clamp(40px,5vw,64px); text-align:center; }
.section__title{
  font-family:var(--display);
  font-weight:700;
  font-size:clamp(1.9rem,4vw,2.9rem);
  line-height:1.1;
  letter-spacing:-.02em;
}
.section__sub{ color:var(--muted); margin-top:16px; font-size:1.05rem; }

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--display);
  font-weight:600; font-size:.95rem;
  padding:14px 26px; border-radius:999px;
  border:1px solid transparent; cursor:pointer;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s, color .25s, border-color .25s;
  white-space:nowrap;
}
.btn--gold{
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  color:#0A0C10;
  box-shadow:0 8px 30px -8px rgba(240,180,41,.5);
}
.btn--gold:hover{ transform:translateY(-2px); box-shadow:0 14px 38px -8px rgba(240,180,41,.65); }
.btn--outline{ border-color:var(--border); color:var(--text); background:var(--glass); }
.btn--outline:hover{ border-color:var(--gold); color:var(--gold); transform:translateY(-2px); }
.btn--ghost{ border-color:var(--border); color:var(--text); padding:10px 18px; font-size:.85rem; }
.btn--ghost:hover{ border-color:var(--gold); color:var(--gold); }
.btn--block{ width:100%; }
.btn--sm{ padding:9px 18px; font-size:.82rem; }

/* ============================================
   NAVBAR
   ============================================ */
.nav{
  position:fixed; inset:0 0 auto 0; z-index:100;
  height:var(--nav-h); display:flex; align-items:center;
  transition:background .3s, border-color .3s, backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(10,12,16,.78);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  border-bottom-color:var(--border-2);
}
.nav__inner{ display:flex; align-items:center; justify-content:space-between; }
.nav__logo{
  font-family:var(--display); font-weight:700; font-size:1.25rem; letter-spacing:-.01em;
}
.nav__logo-dot{ color:var(--gold); }
.nav__links{ display:flex; align-items:center; gap:30px; }
.nav__links a{ font-size:.92rem; color:var(--muted); transition:color .2s; font-weight:500; position:relative; }
.nav__links a:not(.nav__cta)::after{
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:100%;
  background:var(--gold); border-radius:2px;
  transform:scaleX(0); transform-origin:left; transition:transform .3s var(--ease);
}
.nav__links a:not(.nav__cta):hover::after{ transform:scaleX(1); }
.nav__links a:hover{ color:var(--text); }
.nav__cta{ color:var(--text)!important; }

.nav__burger{
  display:none; flex-direction:column; gap:5px;
  background:none; border:0; cursor:pointer; padding:6px;
}
.nav__burger span{ width:24px; height:2px; background:var(--text); border-radius:2px; transition:.3s var(--ease); }
.nav__burger.open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav__burger.open span:nth-child(2){ opacity:0; }
.nav__burger.open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ============================================
   HERO
   ============================================ */
.hero{
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:center;
  padding-top:var(--nav-h); overflow:hidden;
}
.hero__bg{
  position:absolute; inset:0; z-index:0;
  background:
    radial-gradient(120% 90% at 75% 15%, rgba(240,180,41,.10), transparent 55%),
    radial-gradient(100% 80% at 15% 90%, rgba(215,38,56,.07), transparent 60%),
    linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
}
/* When a real photo is set via data-img, JS swaps to this layered bg */
.hero__bg.has-img{
  background-size:cover; background-position:center;
}
.hero__bg.has-img::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(120% 90% at 75% 15%, rgba(240,180,41,.12), transparent 55%),
    linear-gradient(180deg, rgba(10,12,16,.55) 0%, rgba(10,12,16,.88) 100%);
}
.hero__grid{
  position:absolute; inset:0; z-index:1; opacity:.5;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(120% 80% at 50% 0%, #000, transparent 80%);
  -webkit-mask-image:radial-gradient(120% 80% at 50% 0%, #000, transparent 80%);
}
/* jemný filmový grain — zabíjí "plochý AI gradient" dojem */
.hero::after{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.hero__inner{ position:relative; z-index:2; max-width:780px; }
.hero__phone{
  display:inline-flex; align-items:center; gap:10px; white-space:nowrap;
  font-family:var(--display); font-weight:600; font-size:1.05rem;
  padding:14px 22px; border-radius:999px;
  border:1px solid var(--border); background:var(--glass);
  transition:border-color .25s, color .25s, transform .25s var(--ease);
}
.hero__phone svg{ width:18px; height:18px; color:var(--gold); }
.hero__phone:hover{ border-color:var(--gold); color:var(--gold); transform:translateY(-2px); }
.hero__tags{
  margin-top:26px; font-family:var(--mono); font-size:.72rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2);
}
.hero__title{
  font-family:var(--display); font-weight:700;
  font-size:clamp(2.6rem,7vw,5rem); line-height:1.04; letter-spacing:-.03em;
  margin-bottom:24px;
}
.hero__lead{ font-size:clamp(1.05rem,1.6vw,1.25rem); color:var(--muted); max-width:600px; margin-bottom:36px; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; }

.hero__scroll{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:2;
  width:26px; height:42px; border:2px solid var(--border); border-radius:14px;
  display:flex; justify-content:center; padding-top:7px;
}
.hero__scroll span{ width:3px; height:8px; background:var(--gold); border-radius:2px; animation:scroll 1.6s var(--ease) infinite; }
@keyframes scroll{ 0%{opacity:0;transform:translateY(-4px)} 50%{opacity:1} 100%{opacity:0;transform:translateY(12px)} }

/* ============================================
   STATS
   ============================================ */
.stats{ border-top:1px solid var(--border-2); border-bottom:1px solid var(--border-2); background:var(--bg-2); }
.stats__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stat{ text-align:center; padding:44px 16px; position:relative; }
.stat:not(:last-child)::after{ content:""; position:absolute; right:0; top:25%; height:50%; width:1px; background:var(--border-2); }
.stat__num{ font-family:var(--display); font-weight:700; font-size:clamp(2rem,4vw,3rem); color:var(--gold); letter-spacing:-.02em; }
.stat__label{ color:var(--muted); font-size:.92rem; margin-top:6px; }

/* ============================================
   SERVICES
   ============================================ */
.services{ display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.card__num{
  position:absolute; top:26px; right:28px;
  font-family:var(--mono); font-weight:700; font-size:.8rem;
  letter-spacing:.12em; color:rgba(240,180,41,.45);
}
.card__num--red{ color:rgba(215,38,56,.55); }
.card--featured{
  grid-column:1 / -1;
  display:grid; grid-template-columns:1.15fr 1fr; gap:0;
  padding:0; overflow:hidden;
}
.card--featured .card__body{ padding:38px 36px; position:relative; }
.card--featured .card__num{ top:30px; right:34px; }
.card__media{
  min-height:300px; background-size:cover; background-position:center 30%;
  border-left:1px solid var(--border);
  position:relative;
}
.card__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(10,12,16,.55), transparent 45%);
}
.card{
  background:var(--glass); border:1px solid var(--border);
  border-radius:var(--radius); padding:34px 30px;
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  transition:transform .35s var(--ease), border-color .35s, background .35s;
  position:relative; overflow:hidden;
}
.card::before{
  content:""; position:absolute; inset:0; border-radius:inherit; padding:1px;
  background:linear-gradient(160deg, rgba(240,180,41,.4), transparent 40%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  opacity:0; transition:opacity .35s;
}
.card:hover{ transform:translateY(-6px); background:var(--glass-2); }
.card:hover::before{ opacity:1; }
.card__icon{
  width:54px; height:54px; border-radius:14px;
  display:grid; place-items:center; margin-bottom:22px;
  background:var(--gold-soft); color:var(--gold);
  border:1px solid rgba(240,180,41,.25);
}
.card__icon svg{ width:26px; height:26px; }
.card__icon--red{ background:rgba(215,38,56,.12); color:var(--red); border-color:rgba(215,38,56,.3); }
.card__title{ font-family:var(--display); font-weight:600; font-size:1.2rem; margin-bottom:12px; line-height:1.25; }
.card__text{ color:var(--muted); font-size:.96rem; margin-bottom:18px; }
.card__list li{ position:relative; padding-left:22px; color:var(--text); font-size:.9rem; margin-bottom:8px; }
.card__list li::before{ content:""; position:absolute; left:0; top:.6em; width:7px; height:7px; border-radius:50%; background:var(--gold); }
.card--accent .card__list li::before{ background:var(--red); }
.card__link{
  display:inline-flex; align-items:center; gap:8px; margin-top:20px;
  font-family:var(--display); font-weight:600; font-size:.92rem; color:var(--red);
  transition:gap .25s var(--ease), color .25s;
}
.card__link span{ transition:transform .25s var(--ease); }
.card__link:hover{ color:#ff4d5e; }
.card__link:hover span{ transform:translateX(4px); }

/* ============================================
   ABOUT
   ============================================ */
.about{ background:var(--bg-2); border-top:1px solid var(--border-2); }
.about__grid{ display:grid; grid-template-columns:1fr 1.1fr; gap:60px; align-items:center; }
.about__media{ position:relative; }
.about__photo{
  aspect-ratio:4/5; border-radius:var(--radius); border:1px solid var(--border);
  background:
    radial-gradient(80% 60% at 70% 20%, rgba(240,180,41,.12), transparent),
    linear-gradient(160deg, #1a1f28, #0c0e13);
  position:relative; overflow:hidden;
  background-size:cover; background-position:center;
}
.about__photo::after{
  content:"GF"; position:absolute; inset:0; display:grid; place-items:center;
  font-family:var(--display); font-weight:700; font-size:5rem; color:rgba(255,255,255,.04);
}
.about__photo.has-img::after{ display:none; }
.about__badge{
  position:absolute; right:-14px; bottom:28px;
  background:var(--surface); border:1px solid var(--border);
  border-radius:14px; padding:16px 22px; display:flex; flex-direction:column;
  box-shadow:0 20px 50px -20px rgba(0,0,0,.7);
}
.about__badge-num{ font-family:var(--display); font-weight:700; font-size:1.8rem; color:var(--gold); }
.about__badge-txt{ font-size:.78rem; color:var(--muted); max-width:120px; }
.about__text{ color:var(--muted); margin-bottom:16px; font-size:1.02rem; }
.about__points{ margin:24px 0 30px; display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.about__points li{ font-size:.94rem; }
.about__points span{ color:var(--gold); font-weight:700; margin-right:8px; }

/* ============================================
   GALLERY
   ============================================ */
.gallery{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:200px; gap:16px; }
.gallery__item{
  border-radius:var(--radius-sm); border:1px solid var(--border); overflow:hidden;
  background:
    radial-gradient(70% 60% at 30% 20%, rgba(240,180,41,.08), transparent),
    linear-gradient(160deg, #161b23, #0c0e13);
  background-size:cover; background-position:center;
  position:relative; display:grid; place-items:center;
  transition:transform .4s var(--ease);
}
.gallery__item--lg{ grid-column:span 2; grid-row:span 2; }
.gallery__item:hover{ transform:scale(.99); }
.gallery__ph{ font-family:var(--mono); font-size:.74rem; letter-spacing:.15em; text-transform:uppercase; color:var(--muted-2); }
.gallery__item.has-img .gallery__ph{ display:none; }
.gallery__item::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, transparent 45%, rgba(10,12,16,.78));
  opacity:0; transition:opacity .4s;
}
.gallery__item.has-img:hover::after{ opacity:1; }
.gallery__cap{
  position:absolute; left:14px; right:14px; bottom:12px; z-index:1;
  font-family:var(--mono); font-size:.68rem; letter-spacing:.1em;
  text-transform:uppercase; color:var(--text);
  opacity:0; transform:translateY(6px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
  pointer-events:none;
}
.gallery__item.has-img:hover .gallery__cap{ opacity:1; transform:none; }
@media (hover:none){
  .gallery__item.has-img .gallery__cap{ opacity:1; transform:none; }
  .gallery__item.has-img::after{ opacity:1; }
}

/* ============================================
   POPTÁVKA / FORM
   ============================================ */
.poptavka{ background:var(--bg-2); border-top:1px solid var(--border-2); }
.poptavka__grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:56px; align-items:start; }
.poptavka__text{ color:var(--muted); margin:16px 0 24px; font-size:1.02rem; }
.poptavka__points{ display:grid; gap:12px; margin-bottom:30px; }
.poptavka__points li{ font-size:.96rem; }
.poptavka__points span{ color:var(--gold); font-weight:700; margin-right:8px; }
.poptavka__contact{ display:grid; gap:10px; }
.poptavka__phone{ display:inline-flex; align-items:center; gap:10px; font-family:var(--display); font-weight:600; font-size:1.3rem; color:var(--text); }
.poptavka__phone svg{ width:22px; height:22px; color:var(--gold); }
.poptavka__phone:hover{ color:var(--gold); }
.poptavka__email{ color:var(--muted); }
.poptavka__email:hover{ color:var(--gold); }

.form{
  background:var(--glass); border:1px solid var(--border); border-radius:var(--radius);
  padding:32px; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  display:grid; gap:16px;
}
.form__row{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form__field{ display:grid; gap:7px; }
.form__field span{ font-size:.82rem; color:var(--muted); font-weight:500; }
.form__field input, .form__field select, .form__field textarea{
  font-family:var(--body); font-size:.95rem; color:var(--text);
  background:rgba(0,0,0,.25); border:1px solid var(--border);
  border-radius:10px; padding:12px 14px; transition:border-color .2s, background .2s;
  width:100%; resize:vertical;
}
.form__field input::placeholder, .form__field textarea::placeholder{ color:var(--muted-2); }
.form__field input:focus, .form__field select:focus, .form__field textarea:focus{
  outline:none; border-color:var(--gold); background:rgba(0,0,0,.4);
}
.form__field select option{ background:var(--surface); }
.form__check{ display:flex; gap:10px; align-items:flex-start; font-size:.82rem; color:var(--muted); }
.form__check input{ margin-top:3px; accent-color:var(--gold); width:16px; height:16px; flex-shrink:0; }
.form__note{ text-align:center; font-size:.8rem; color:var(--muted-2); }

/* ============================================
   KONTAKT
   ============================================ */
.kontakt__grid{ display:grid; grid-template-columns:1fr 1.2fr; gap:24px; }
.kontakt__cards{ display:grid; grid-template-columns:1fr 1fr; gap:16px; align-content:start; }
.kontakt__card{
  background:var(--glass); border:1px solid var(--border); border-radius:var(--radius-sm);
  padding:24px; display:grid; gap:8px; transition:border-color .3s, transform .3s, background .3s;
}
.kontakt__card:hover{ border-color:var(--gold); transform:translateY(-3px); background:var(--glass-2); }
.kontakt__label{ font-family:var(--mono); font-size:.7rem; letter-spacing:.18em; text-transform:uppercase; color:var(--gold); }
.kontakt__value{ font-family:var(--display); font-weight:600; font-size:1.05rem; line-height:1.4; }
.kontakt__map{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--border); min-height:340px; }
.kontakt__map iframe{ width:100%; height:100%; min-height:340px; border:0; filter:grayscale(.3) invert(.9) hue-rotate(180deg) contrast(.9); }

/* ============================================
   FOOTER
   ============================================ */
.footer{ background:var(--bg-2); border-top:1px solid var(--border-2); padding-top:56px; }
.footer__inner{ display:grid; grid-template-columns:1.3fr 1fr 1.2fr; gap:40px; padding-bottom:40px; }
.footer__brand p{ color:var(--muted); margin-top:12px; font-size:.94rem; }
.footer__nav{ display:flex; flex-direction:column; gap:10px; }
.footer__nav a{ color:var(--muted); font-size:.94rem; transition:color .2s; }
.footer__nav a:hover{ color:var(--gold); }
.footer__contact{ display:flex; flex-direction:column; gap:10px; }
.footer__contact a, .footer__contact span{ color:var(--muted); font-size:.94rem; }
.footer__contact a:hover{ color:var(--gold); }
.footer__bottom{ border-top:1px solid var(--border-2); padding:22px 0; }
.footer__bottom .container{ display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; font-size:.84rem; color:var(--muted-2); }
.footer__bottom a{ color:var(--gold); }

/* ============================================
   COOKIE BANNER
   ============================================ */
.cookie{
  position:fixed; left:24px; right:24px; bottom:24px; z-index:200;
  max-width:560px; margin-inline:auto;
  background:rgba(20,24,31,.92); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
  border:1px solid var(--border); border-radius:var(--radius);
  padding:20px 24px; display:flex; align-items:center; gap:20px; flex-wrap:wrap;
  box-shadow:0 30px 60px -20px rgba(0,0,0,.8);
  animation:cookieUp .5s var(--ease);
}
.cookie[hidden]{ display:none; }
@keyframes cookieUp{ from{ opacity:0; transform:translateY(20px); } to{ opacity:1; transform:none; } }
.cookie p{ flex:1; min-width:220px; font-size:.88rem; color:var(--muted); }
.cookie__actions{ display:flex; gap:10px; }

/* ============================================
   REVEAL ANIMATIONS
   ============================================ */
.reveal{ opacity:0; transform:translateY(26px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  html{ scroll-behavior:auto; }
  .hero__scroll span{ animation:none; }
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width:1024px){
  .about__grid, .poptavka__grid, .kontakt__grid{ grid-template-columns:1fr; gap:40px; }
  .about__media{ max-width:420px; }
  .footer__inner{ grid-template-columns:1fr 1fr; }
}
@media (max-width:768px){
  .nav__links{
    position:fixed; top:var(--nav-h); left:0; right:0;
    height:calc(100svh - var(--nav-h));
    flex-direction:column; align-items:stretch; justify-content:flex-start; gap:0;
    background:#0A0C10;
    border-bottom:1px solid var(--border); padding:16px 24px 28px; overflow-y:auto;
    transform:translateY(-120%); transition:transform .4s var(--ease); pointer-events:none;
  }
  .nav__links.open{ transform:none; pointer-events:auto; }
  .nav__links a{ padding:14px 0; border-bottom:1px solid var(--border-2); font-size:1rem; }
  .nav__cta{ margin-top:14px; text-align:center; border:1px solid var(--gold); border-radius:999px; }
  .nav__burger{ display:flex; }
  .services{ grid-template-columns:1fr; }
  .card--featured{ grid-template-columns:1fr; }
  .card__media{ min-height:220px; order:-1; border-left:0; border-bottom:1px solid var(--border); }
  .card__media::after{ background:linear-gradient(180deg, transparent 55%, rgba(10,12,16,.6)); }
  .hero__phone{ justify-content:center; }
  .stats__grid{ grid-template-columns:1fr 1fr; }
  .stat:nth-child(2)::after{ display:none; }
  .stat:nth-child(1)::after, .stat:nth-child(3)::after{ display:none; }
  .gallery{ grid-template-columns:1fr 1fr; grid-auto-rows:160px; }
  .gallery__item--lg{ grid-column:span 2; grid-row:span 1; }
  .about__points{ grid-template-columns:1fr; }
}
@media (max-width:480px){
  .container{ padding-inline:18px; }
  .form{ padding:22px; }
  .form__row{ grid-template-columns:1fr; }
  .kontakt__cards{ grid-template-columns:1fr; }
  .footer__inner{ grid-template-columns:1fr; gap:28px; }
  .about__badge{ right:0; }
  .hero__actions{ flex-direction:column; align-items:stretch; }
  .hero__actions .btn, .hero__phone{ width:100%; }
}