/* =============================================================
   Warranty page  -  Ward Communities BOYL
   Scoped .wty-* classes. Relies on shared tokens/base/style.css
   for .container, .btn, .section-eyebrow, .section-title, fonts.
   ============================================================= */

/* reveal base (safe to repeat; matches site behavior) */
[data-reveal]{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
[data-reveal].is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ [data-reveal]{ opacity:1; transform:none; transition:none; } }

/* ============================ HERO ============================ */
.wty-hero{ position:relative; isolation:isolate; background:#0b1110; overflow:hidden; }

.wty-hero__bg{ position:absolute; inset:0; z-index:0; overflow:hidden; }
.wty-hero__poster{
  width:100%; height:100%; object-fit:cover; object-position:center 58%;
  transform-origin:center; animation:wtyKB 22s ease-in-out infinite alternate;
}
@keyframes wtyKB{ from{ transform:scale(1.06); } to{ transform:scale(1.17); } }

.wty-hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(7,12,11,.34) 0%, rgba(7,12,11,.14) 30%, rgba(7,12,11,.60) 72%, rgba(11,17,16,.93) 100%),
    radial-gradient(125% 85% at 50% 26%, transparent 38%, rgba(7,12,11,.48) 100%);
}

.wty-hero__inner{
  position:relative; z-index:2;
  min-height:88vh;
  display:flex; flex-direction:column; align-items:flex-start; justify-content:flex-end;
  padding-top:23vh; padding-bottom:9vh;
  color:#fff;
}

.wty-hero__ribbon{
  display:inline-flex; align-items:center; gap:.55rem;
  padding:.5rem .95rem; border-radius:999px;
  border:1px solid rgba(249,160,37,.55); background:rgba(9,63,60,.42);
  -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px);
  font-size:.76rem; letter-spacing:.13em; text-transform:uppercase; font-weight:600; color:#ffe6c2;
}
.wty-hero__ribbon svg{ width:1.05rem; height:1.05rem; flex:none; }

.wty-hero__title{
  margin:1.15rem 0 0; color:#fff;
  font-size:clamp(2.4rem, 6vw, 4.7rem); line-height:1.02; letter-spacing:-.012em; max-width:17ch;
  text-shadow:0 2px 34px rgba(0,0,0,.38);
}
.wty-hero__title-accent{ color:#F9A025; }

.wty-hero__lede{
  margin:1.2rem 0 0; max-width:60ch;
  font-size:clamp(1.02rem, 1.55vw, 1.22rem); line-height:1.6; color:rgba(255,255,255,.9);
}

.wty-hero__ctas{ display:flex; flex-wrap:wrap; gap:.8rem; margin-top:1.9rem; }

/* QBW Builder of Integrity  -  wax-seal style stamp */
.wty-hero__badge{
  position:absolute; z-index:3; margin:0;
  top:14vh; right:max(4vw, calc(50% - 600px));
  width:clamp(150px, 16vw, 236px); transform:none;
  filter:drop-shadow(0 18px 32px rgba(0,0,0,.42));
  animation:wtyStamp .85s cubic-bezier(.2,.9,.3,1.25) .3s both;
}
.wty-hero__badge img{ display:block; width:100%; height:auto; }
@keyframes wtyStamp{ 0%{ opacity:0; transform:scale(1.4); } 100%{ opacity:1; transform:scale(1); } }

.wty-hero__scroll{
  position:absolute; left:50%; bottom:2.1rem; transform:translateX(-50%); z-index:2;
  width:26px; height:42px; border:2px solid rgba(255,255,255,.6); border-radius:14px;
}
.wty-hero__scroll span{
  position:absolute; left:50%; top:8px; width:3px; height:8px; border-radius:2px; background:#fff;
  transform:translateX(-50%); animation:wtyScroll 1.8s ease-in-out infinite;
}
@keyframes wtyScroll{ 0%{ opacity:0; transform:translate(-50%,0); } 40%{ opacity:1; } 100%{ opacity:0; transform:translate(-50%,14px); } }

/* ---------- mobile: natural image band + content overlap (matches About) ---------- */
@media (max-width:768px){
  .wty-hero{ display:block; }
  .wty-hero__bg{ position:relative; width:100%; height:auto; }
  .wty-hero__poster{ position:relative; width:100%; height:auto; aspect-ratio:4/3; }
  .wty-hero__scrim{
    background:linear-gradient(180deg, rgba(7,12,11,.12) 0%, rgba(7,12,11,.04) 42%, rgba(11,17,16,.86) 86%, #0b1110 100%);
  }
  .wty-hero__inner{ min-height:0; padding:0 1.25rem 2.6rem; margin-top:-22vw; }
  .wty-hero__title{ font-size:clamp(2rem, 9vw, 2.9rem); max-width:none; }
  .wty-hero__lede{ font-size:1.02rem; }
  .wty-hero__badge{ top:clamp(12px,3.5vw,26px); right:clamp(12px,3.5vw,26px); margin-top:0; width:76px; }
  .wty-hero__scroll{ display:none; }
}

@media (prefers-reduced-motion:reduce){
  .wty-hero__poster{ animation:none; } .wty-hero__badge{ animation:none; } .wty-hero__scroll span{ animation:none; }
}


/* ===================== SECTIONS 2-4 (intro / walkthroughs / reviews) ===================== */
.wty-intro{ padding:clamp(3.5rem,8vw,6rem) 0 clamp(1rem,3vw,2rem); }
.wty-intro__inner{ max-width:820px; text-align:center; margin-inline:auto; }
.wty-intro__lede{ margin:1.1rem auto 0; max-width:62ch; font-size:clamp(1.05rem,1.6vw,1.22rem); line-height:1.65; color:var(--ink-soft,#44524d); }

.wty-before{ padding:clamp(2.5rem,6vw,4.5rem) 0 clamp(3.5rem,8vw,6rem); }
.wty-before__head{ max-width:780px; margin:0 auto clamp(2rem,4vw,3rem); text-align:center; }
.wty-before__lede{ margin:1rem auto 0; max-width:60ch; color:var(--ink-soft,#44524d); line-height:1.6; }
.wty-before__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1.2rem,2.4vw,2rem); }
.wty-walk{ display:flex; flex-direction:column; background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 24px 50px -34px rgba(9,63,60,.5); border:1px solid rgba(9,63,60,.08); }
.wty-walk__media{ margin:0; aspect-ratio:4/3; overflow:hidden; }
.wty-walk__media img{ width:100%; height:100%; object-fit:cover; transform-origin:center; animation:wtyKB 20s ease-in-out infinite alternate; }
.wty-walk__body{ padding:1.4rem 1.4rem 1.6rem; }
.wty-walk__step{ display:inline-block; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:#F9A025; margin-bottom:.5rem; }
.wty-walk__title{ margin:0 0 .55rem; font-size:1.32rem; line-height:1.15; color:#093F3C; }
.wty-walk__body p{ margin:0; color:var(--ink-soft,#44524d); line-height:1.6; font-size:.98rem; }

.wty-after{ padding:clamp(3rem,7vw,5rem) 0; background:rgba(9,63,60,.04); }
.wty-after__head{ max-width:760px; margin:0 auto clamp(1.8rem,3.5vw,2.6rem); text-align:center; }
.wty-after__lede{ margin:1rem auto 0; max-width:58ch; color:var(--ink-soft,#44524d); line-height:1.6; }
.wty-after__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.4vw,1.8rem); max-width:880px; margin:0 auto; }
.wty-review{ background:#fff; border-radius:16px; padding:1.8rem 1.6rem; border:1px solid rgba(9,63,60,.08); box-shadow:0 20px 44px -34px rgba(9,63,60,.45); }
.wty-review__mark{ display:flex; align-items:baseline; gap:.4rem; font-size:2.6rem; font-weight:700; line-height:1; color:#093F3C; }
.wty-review__mark span{ font-size:.85rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:#F9A025; }
.wty-review__title{ margin:.7rem 0 .45rem; font-size:1.18rem; color:#093F3C; }
.wty-review p{ margin:0; color:var(--ink-soft,#44524d); line-height:1.6; font-size:.98rem; }
.wty-after__note{ max-width:680px; margin:clamp(1.6rem,3vw,2.2rem) auto 0; text-align:center; font-size:.95rem; color:var(--ink-soft,#44524d); }
.wty-after__note a{ color:#093F3C; text-decoration:underline; }

@media (max-width:900px){ .wty-before__grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; } }
@media (max-width:640px){ .wty-after__grid{ grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce){ .wty-walk__media img{ animation:none; } }


/* ===================== SECTION 5: COVERAGE 1-2-10 ===================== */
.wty-cov{ padding:clamp(3.5rem,8vw,6rem) 0; }
.wty-cov__head{ max-width:820px; margin:0 auto clamp(2rem,4vw,3rem); text-align:center; }
.wty-cov__lede{ margin:1rem auto 0; max-width:62ch; color:var(--ink-soft,#44524d); line-height:1.6; }
.wty-cov__grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.6rem); align-items:stretch; }
.wty-tier{ position:relative; background:#fff; border:1px solid rgba(9,63,60,.1); border-radius:16px; padding:1.9rem 1.5rem 1.6rem; overflow:hidden; box-shadow:0 22px 46px -34px rgba(9,63,60,.45); }
.wty-tier::before{ content:""; position:absolute; inset:0 0 auto 0; height:4px; background:#F9A025; }
.wty-tier__year{ display:block; font-size:.82rem; letter-spacing:.12em; text-transform:uppercase; color:#7a8a83; font-weight:600; }
.wty-tier__year strong{ color:#093F3C; font-size:1.05rem; }
.wty-tier__title{ margin:.5rem 0 .35rem; font-size:1.3rem; color:#093F3C; line-height:1.15; }
.wty-tier__lead{ margin:0 0 .6rem; font-weight:600; color:#093F3C; }
.wty-tier__ex{ margin:0; color:var(--ink-soft,#44524d); line-height:1.55; font-size:.95rem; }
.wty-tier--feature{ background:#093F3C; border-color:#093F3C; }
.wty-tier--feature .wty-tier__year{ color:rgba(255,255,255,.7); }
.wty-tier--feature .wty-tier__year strong,
.wty-tier--feature .wty-tier__title,
.wty-tier--feature .wty-tier__lead{ color:#fff; }
.wty-tier--feature .wty-tier__ex{ color:rgba(255,255,255,.85); }
.wty-cov__notes{ list-style:none; margin:clamp(1.8rem,3vw,2.6rem) auto 0; padding:0; max-width:860px; display:grid; gap:.85rem; }
.wty-cov__notes li{ display:flex; gap:.65rem; align-items:flex-start; color:var(--ink-soft,#44524d); line-height:1.5; font-size:.96rem; }
.wty-cov__notes svg{ width:1.3rem; height:1.3rem; flex:none; margin-top:.1rem; color:#F9A025; }
.wty-cov__notes strong{ color:#093F3C; }
.wty-cov__notes a{ color:#093F3C; text-decoration:underline; }

/* ===================== SECTION 6: SERVICE ===================== */
.wty-svc{ padding:clamp(3.5rem,8vw,6rem) 0; background:#093F3C; color:#fff; }
.wty-svc__head{ max-width:760px; margin:0 auto clamp(2rem,4vw,2.8rem); text-align:center; }
.wty-svc__lede{ margin:1rem auto 0; max-width:56ch; color:rgba(255,255,255,.85); line-height:1.6; }
.wty-svc__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.4vw,1.8rem); max-width:980px; margin:0 auto; }
.wty-svc__card{ background:#fff; color:#093F3C; border-radius:16px; padding:1.9rem 1.7rem; box-shadow:0 26px 52px -34px rgba(0,0,0,.5); border-top:4px solid #2f6f5f; }
.wty-svc__card--urgent{ border-top-color:#F9A025; }
.wty-svc__tag{ display:inline-block; font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:#F9A025; margin-bottom:.5rem; }
.wty-svc__tag--calm{ color:#2f6f5f; }
.wty-svc__title{ margin:0 0 .55rem; font-size:1.32rem; color:#093F3C; }
.wty-svc__card p{ margin:0 0 1.2rem; color:var(--ink-soft,#44524d); line-height:1.6; font-size:.98rem; }
.wty-svc__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1rem; }
.wty-svc__tel,.wty-svc__link{ color:#093F3C; font-weight:600; font-size:.95rem; }
.wty-svc__link{ text-decoration:underline; }
.wty-svc__tel{ opacity:.8; text-decoration:none; }

/* ghost button on the dark hero (about.css scopes this for its own hero; add for ours) */
.wty-hero .btn--ghost{ border:1.5px solid rgba(255,255,255,.55); color:#fff; background:transparent; }
.wty-hero .btn--ghost:hover, .wty-hero .btn--ghost:focus-visible{ background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }

@media (max-width:820px){
  .wty-cov__grid{ grid-template-columns:1fr; max-width:520px; margin-inline:auto; }
  .wty-svc__grid{ grid-template-columns:1fr; }
}


/* ===================== SECTION 7: TRUST + AGREEMENTS ===================== */
.wty-trust{ padding:clamp(3.5rem,8vw,6rem) 0; background:#f6f8f7; }
.wty-trust__head{ max-width:820px; margin:0 auto clamp(1.8rem,3.5vw,2.6rem); text-align:center; }
.wty-trust__lede{ margin:1rem auto 0; max-width:64ch; color:var(--ink-soft,#44524d); line-height:1.6; }
.wty-trust__points{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,2vw,1.6rem); max-width:1000px; margin:0 auto clamp(2.4rem,5vw,3.4rem); }
.wty-trust__point{ display:flex; gap:.9rem; align-items:flex-start; background:#fff; border:1px solid rgba(9,63,60,.08); border-radius:14px; padding:1.3rem 1.2rem; }
.wty-trust__point h3{ margin:0 0 .3rem; font-size:1.06rem; color:#093F3C; }
.wty-trust__point p{ margin:0; font-size:.92rem; line-height:1.5; color:var(--ink-soft,#44524d); }
.wty-trust__seal{ width:56px; height:56px; flex:none; object-fit:contain; }
.wty-trust__ico{ width:40px; height:40px; flex:none; color:#F9A025; }
.wty-docs{ max-width:1000px; margin:0 auto; }
.wty-docs__title{ text-align:center; font-size:clamp(1.3rem,3vw,1.7rem); color:#093F3C; margin:0 0 .35rem; }
.wty-docs__sub{ text-align:center; color:var(--ink-soft,#44524d); margin:0 auto clamp(1.4rem,3vw,2rem); }
.wty-docs__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.2rem,2.4vw,1.8rem); }
.wty-doc{ background:#fff; border:1px solid rgba(9,63,60,.1); border-radius:16px; overflow:hidden; box-shadow:0 22px 46px -34px rgba(9,63,60,.5); display:flex; flex-direction:column; }
.wty-doc__preview{ position:relative; display:flex; flex-direction:column; gap:.6rem; width:100%; border:0; padding:clamp(14px,3vw,20px); margin:0; background:#eef2f0; cursor:pointer; overflow:hidden; }
.wty-doc__canvas{ display:block; width:100%; height:auto; }
.wty-doc__badge{ order:-1; align-self:flex-start; background:#093F3C; color:#fff; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:700; padding:.32rem .7rem; border-radius:999px; }
.wty-doc__zoom{ position:absolute; bottom:clamp(14px,3vw,20px); right:clamp(14px,3vw,20px); background:rgba(9,63,60,.92); color:#fff; font-size:.8rem; font-weight:600; padding:.4rem .8rem; border-radius:999px; opacity:0; transition:opacity .2s; }
.wty-doc__preview:hover .wty-doc__zoom, .wty-doc__preview:focus-visible .wty-doc__zoom{ opacity:1; }
.wty-doc__meta{ padding:1.1rem 1.2rem 1.3rem; }
.wty-doc__meta h4{ margin:0 0 .8rem; font-size:1.08rem; color:#093F3C; }
.wty-doc__actions{ display:flex; flex-wrap:wrap; align-items:center; gap:.7rem 1rem; }
.wty-doc__dl{ color:#093F3C; font-weight:600; text-decoration:underline; font-size:.92rem; }

/* ===================== SECTION 8: FAQ + CTA ===================== */
.wty-faq{ padding:clamp(3.5rem,8vw,6rem) 0; }
.wty-faq__head{ max-width:760px; margin:0 auto clamp(1.8rem,4vw,2.6rem); text-align:center; }
.wty-faq__list{ max-width:780px; margin:0 auto; display:grid; gap:.8rem; }
.wty-faq__item{ background:#fff; border:1px solid rgba(9,63,60,.12); border-radius:12px; overflow:hidden; }
.wty-faq__q{ cursor:pointer; list-style:none; padding:1.05rem 1.2rem; font-weight:600; color:#093F3C; display:flex; justify-content:space-between; align-items:center; gap:1rem; font-size:1.02rem; }
.wty-faq__q::-webkit-details-marker{ display:none; }
.wty-faq__q::after{ content:"+"; font-size:1.4rem; color:#F9A025; line-height:1; flex:none; }
.wty-faq__item[open] .wty-faq__q::after{ content:"\2013"; }
.wty-faq__a{ padding:0 1.2rem 1.15rem; color:var(--ink-soft,#44524d); line-height:1.6; }
.wty-faq__a a{ color:#093F3C; text-decoration:underline; }
.wty-cta{ padding:clamp(3.5rem,8vw,6rem) 0; background:#093F3C; color:#fff; text-align:center; }
.wty-cta h2{ font-size:clamp(1.7rem,4.5vw,2.6rem); margin:0 0 .8rem; color:#fff; line-height:1.12; }
.wty-cta p{ max-width:54ch; margin:0 auto 1.7rem; color:rgba(255,255,255,.85); line-height:1.6; }
.wty-cta__actions{ display:flex; flex-wrap:wrap; gap:.9rem; justify-content:center; }
.wty-cta .btn--primary{ background:#F9A025; color:#093F3C; border-color:#F9A025; }
.wty-cta .btn--ghost{ border:1.5px solid rgba(255,255,255,.55); color:#fff; background:transparent; }
.wty-cta .btn--ghost:hover, .wty-cta .btn--ghost:focus-visible{ background:rgba(255,255,255,.12); border-color:#fff; color:#fff; }

@media (max-width:820px){
  .wty-trust__points{ grid-template-columns:1fr; max-width:520px; }
  .wty-docs__grid{ grid-template-columns:1fr; }
}

.wty-doc__cover{ display:block; width:100%; height:auto; border-radius:14px; border:1px solid rgba(9,63,60,.12); box-shadow:0 12px 28px -16px rgba(9,63,60,.55); }

.wty-doc{ transition:transform .25s ease, box-shadow .25s ease; }
.wty-doc:hover{ transform:translateY(-4px); box-shadow:0 32px 58px -30px rgba(9,63,60,.62); }
@media (prefers-reduced-motion: reduce){ .wty-doc{ transition:none; } .wty-doc:hover{ transform:none; } }