/* Site-wide responsive behaviour.
   Layout, spacing, tap targets and overflow only.
   Visual identity stays in theme / page CSS. */

:root{
  --page-gutter:clamp(1rem, 4.8vw, 1.5rem);
  --header-offset:calc(var(--header-h, 72px) + env(safe-area-inset-top, 0px));
  --tap:44px;
}

html,
body{
  max-width:100%;
  overflow-x:clip;
}

img,
video,
canvas,
svg{
  max-width:100%;
}

img:not(.brand-lockup__img),
video{
  height:auto;
}

iframe{
  max-width:100%;
}

h1, h2, h3, p, li, dd, .lead, .muted{
  overflow-wrap:break-word;
}

h1, h2{
  text-wrap:pretty;
}

.home-hero > *,
.svc-hero > *,
.work-feature > *,
.start-layout > *,
.site-header__inner > *,
.need-row > *,
.price-row > *,
.offer-card,
.plan-card{
  min-width:0;
}

.container,
.home-hero,
.svc-wrap,
.work-wrap,
.convert-wrap,
.convert-wrap--narrow,
.start-wrap{
  padding-left:max(var(--page-gutter), env(safe-area-inset-left, 0px));
  padding-right:max(var(--page-gutter), env(safe-area-inset-right, 0px));
}

.apple-seg__btn{
  min-height:var(--tap);
  min-width:var(--tap);
  touch-action:manipulation;
}

.faq-trigger,
.start-opt,
.need-pick,
.start-product,
.svc-path__step,
.svc-app__nav button{
  min-height:var(--tap);
  touch-action:manipulation;
}

.scroll-top{
  right:max(1rem, env(safe-area-inset-right, 0px));
  bottom:max(1rem, env(safe-area-inset-bottom, 0px));
  width:var(--tap);
  height:var(--tap);
  min-width:50px;
  min-height:50px;
}

.site-footer__bottom{
  padding-right:4.5rem;
}

/* Forms — 16px prevents iOS Safari zoom; comfortable touch fields */

label{
  font-size:max(.92rem, 14px);
}

.form input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
.form select,
.form textarea,
input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="submit"]):not([type="button"]),
select,
textarea{
  font-size:16px;
  line-height:1.4;
  min-height:var(--tap);
  max-width:100%;
}

.form textarea,
textarea{
  min-height:8.5rem;
}

.form-error,
.notice,
[role="alert"]{
  max-width:100%;
  overflow-wrap:break-word;
}

/* Large monitors: keep measure comfortable, do not stretch */

@media(min-width:1440px){
  :root{ --container:1240px; }

  .home-hero{
    min-height:min(calc(100dvh - var(--header-offset)), 52rem);
  }
}

@media(min-width:1920px){
  .home-hero{
    min-height:min(calc(100dvh - var(--header-offset)), 56rem);
  }

  .lead,
  .hero p,
  .home-hero__lead,
  .svc-hero__lead,
  .convert-lead,
  .start-lead{
    max-width:40rem;
  }
}

/* Landscape tablets: keep two-column heroes while space allows */

@media(min-width:960px) and (max-width:1279px){
  .home-hero{
    grid-template-columns:minmax(0, 1fr) minmax(220px, 1.05fr);
    gap:clamp(1.1rem, 2.4vw, 2rem);
  }

  .svc-hero,
  .svc[data-svc="mobile"] .svc-hero{
    grid-template-columns:minmax(0, 1.05fr) minmax(220px, .95fr);
  }
}

/* Phone landscape / short viewports */

@media(orientation:landscape) and (max-height:540px){
  .home-hero,
  .svc-hero{
    min-height:0;
    padding-block:clamp(.6rem, 4vh, 1.4rem) 1.4rem;
  }

  .page-hero,
  .convert-hero,
  .start-hero,
  .work-hero,
  .case-hero{
    padding-block:clamp(1.2rem, 6vh, 2.4rem) 1.2rem;
  }

  .nav-screen.is-open{
    padding-top:calc(var(--header-offset) + .4rem);
  }

  .nav-screen__links a{
    font-size:clamp(1.35rem, 7vh, 2.1rem);
    min-height:2.4rem;
  }

  .home-close,
  .svc-close,
  .case-close{
    padding-block:2.5rem;
  }
}

/* Standard phones */

@media(max-width:639px){
  .btns{
    width:100%;
  }

  .home-hero .btns .btn,
  .home-hero .btns .btn-ghost,
  .home-close .btns .btn,
  .home-close .btns .btn-ghost,
  .svc-hero .btns .btn,
  .svc-hero .btns .btn-ghost,
  .svc-close .btns .btn,
  .svc-close .btns .btn-ghost,
  .convert-close .btns .btn,
  .convert-close .btns .btn-ghost,
  .case-close .btns .btn,
  .case-close .btns .btn-ghost,
  .work-hero .btns .btn,
  .work-hero .btns .btn-ghost{
    width:100%;
  }

  .form-grid,
  .need-picks{
    grid-template-columns:1fr;
  }

  .offer-grid,
  .offer-grid--support,
  .plan-grid,
  .plan-grid--3,
  .choice-grid,
  .steps-row,
  .price-snap,
  .faq-jump{
    grid-template-columns:1fr;
  }

  .apple-seg{
    flex-wrap:wrap;
    justify-content:center;
    width:100%;
  }

  .apple-seg__btn{
    flex:1 1 auto;
  }
}

@media(min-width:768px) and (max-width:1119px){
  .nav-screen.is-open{
    align-items:flex-start;
  }

  .nav-screen__cta{
    width:auto;
    min-width:16rem;
  }
}

@media(max-width:430px){
  .menu-toggle__label{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }

  .menu-toggle{
    width:var(--tap);
    padding:0;
  }
}

/* Very small phones */

@media(max-width:980px){
  .device-stage[data-device="laptop"] .demo-frame,
  .device-stage[data-device="tablet"] .demo-frame,
  .device-stage[data-device="phone"] .demo-frame{
    height:clamp(220px, 56vw, 400px);
    min-height:0;
  }
}

@media(max-width:359px){
  :root{ --page-gutter:0.85rem; }

  .home-hero__display,
  .home-hero__sub{
    font-size:clamp(1.9rem, 11vw, 2.4rem);
  }
}
