/* Home CSS. Moved from app.css; shared public sources stay in app.css. */

.home-deals-feed{
      position:relative;
      width:min(1120px,100%);
      margin:0 auto;
      padding:0;
      background:#fbf8f2;
      border:1px solid #d3c8ba;
      border-radius:18px;
      box-shadow:0 14px 30px rgba(50,55,66,.09);
      overflow:hidden;
    }

.home-deals-feed__sections,
    .home-deals-feed__sections > #homeSections{
      position:relative;
      display:grid;
      gap:24px;
      z-index:1;
    }

.home-deals-feed__sections{
      padding:18px;
      padding-block-start:24px;
    }

.home-deals-feed__sections > #homeSections{padding:0;}

.seg.seg-home{
      --home-tab-triangle-h:13px;
      --home-tab-triangle-w:12px;
      position:relative;
      z-index:2;
      display:flex;
      justify-content:center;
      width:100%;
      transform:none;
      border:0;
      border-radius:0;
      background:#f6f1e9;
      padding:0;
      margin:0;
      box-shadow:none;
      border-bottom:1px solid rgba(126,112,94,.30);
    }

.seg.seg-home .seg-track{
      position:relative;
      display:grid;
      grid-template-columns:repeat(3,minmax(0,1fr));
      gap:0;
      align-items:stretch;
      width:100%;
      border:0;
      border-radius:0;
      background:transparent;
      padding:0;
      box-shadow:none;
      overflow:visible;
    }

.seg.seg-home a{
      display:flex;
      align-items:center;
      justify-content:center;
      flex:1 1 0;
      min-width:0;
      min-height:82px;
      padding:0 22px;
      border-radius:0;
      font-weight:900;
      font-size:22px;
      line-height:1.02;
      letter-spacing:0;
      text-align:center;
      white-space:nowrap;
      cursor:pointer;
      user-select:none;
      background:
        linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.24)),
        linear-gradient(90deg,rgba(215,25,32,.12),rgba(215,25,32,.03));
      color:#9f141c;
      position:relative;
      transition:transform .18s ease,box-shadow .18s ease,filter .18s ease;
      border:0;
      border-right:1px solid rgba(92,70,48,.18);
      height:auto;
    }

.seg.seg-home a + a{box-shadow:inset 1px 0 0 rgba(255,255,255,.45);}

.seg.seg-home a:last-child{border-right:0;}

.seg.seg-home a[data-mode="best"]{
  --seg-bg:#d71920;
  --seg-fg:#ffffff;
  --seg-glow:rgba(215,25,32,.28);
  --public-hover-fg:#9f141c;
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.24)),
    linear-gradient(90deg,rgba(215,25,32,.12),rgba(215,25,32,.03));
      color:#9f141c;
    }

.seg.seg-home a[data-mode="clearance"]{
  --seg-bg:#f0d27a;
  --seg-fg:#7a3d00;
  --seg-glow:rgba(240,210,122,.34);
  --public-hover-fg:#745611;
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.24)),
    linear-gradient(90deg,rgba(226,185,71,.28),rgba(226,185,71,.07));
      color:#745611;
    }

.seg.seg-home a[data-mode="cheap"]{
  --seg-bg:#cfe5b8;
  --seg-fg:#335a1a;
  --seg-glow:rgba(207,229,184,.36);
  --public-hover-fg:#2f6735;
  background:
    linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.24)),
    linear-gradient(90deg,rgba(122,189,99,.28),rgba(122,189,99,.07));
      color:#2f6735;
    }

.seg.seg-home a.active{
      background:linear-gradient(180deg,#f32630 0 5px,#ffd5d1 5px,#ffa9a3 100%);
      color:#790009;
      transform:none;
      box-shadow:inset 0 -2px 0 rgba(158,0,10,.10);
      border-color:transparent;
      z-index:2;
    }

.seg.seg-home a.active::before{
      content:"";
      position:absolute;
      left:50%;
      bottom:calc(-1 * var(--home-tab-triangle-h));
      transform:translateX(-50%);
      border-left:var(--home-tab-triangle-w) solid transparent;
      border-right:var(--home-tab-triangle-w) solid transparent;
      border-top:var(--home-tab-triangle-h) solid #d71920;
      z-index:3;
      pointer-events:none;
    }

.seg.seg-home a[data-mode="clearance"].active{
      background:linear-gradient(180deg,#d8ad2a 0 5px,#ffeaa1 5px,#eac85e 100%);
      color:#3e2800;
    }

.seg.seg-home a[data-mode="clearance"].active::before{border-top-color:#d8ad2a;}

.seg.seg-home a[data-mode="cheap"].active{
      background:linear-gradient(180deg,#50b84c 0 5px,#d8f4ca 5px,#a8de91 100%);
      color:#153f1b;
    }

.seg.seg-home a[data-mode="cheap"].active::before{border-top-color:#50b84c;}

@media(min-width:721px) {
.seg.seg-home a{
        padding-top:5px;
        padding-bottom:0;
      }
}

.seg.seg-home.is-loading a.active:not(.is-pending)::after{content:none;}

.seg.seg-home.is-loading a.is-pending::after{content:"";display:inline-block;flex:0 0 auto;width:20px;height:20px;margin-left:10px;box-sizing:border-box;border-radius:999px;background:transparent;border:var(--ajax-spinner-border-width-strong) solid rgba(15,23,42,.26);border-top-color:currentColor;animation:public-ajax-spin var(--ajax-spinner-speed) linear infinite;}

.seg.seg-home.is-loading a.active.is-pending::after{border-color:rgba(255,255,255,.45);border-top-color:#fff;}

.home-mode-status{
      display:flex;
      align-items:flex-start;
      gap:8px;
      margin:12px 18px 0;
      padding:10px 12px;
      border:1px solid #fecaca;
      border-radius:12px;
      background:#fff7f7;
      color:#991b1b;
      font-size:13px;
      font-weight:800;
      line-height:1.3;
    }

.home-mode-status[hidden]{display:none;}

@media(max-width:720px) {
.home-deals-feed{
        margin-top:0;
        border-radius:14px;
      }

.home-deals-feed__sections,
      .home-deals-feed__sections > #homeSections{gap:clamp(18px,3.35vw,24px);}

.home-deals-feed__sections{
        padding:clamp(6px,2.5vw,18px);
        padding-block-start:clamp(18px,3.35vw,24px);
      }

.seg.seg-home{
        --home-tab-triangle-h:clamp(10px,1.8vw,13px);
        --home-tab-triangle-w:clamp(9px,1.7vw,12px);
        padding:0;
        margin:0;
      }

.seg.seg-home .seg-track{
        gap:0;
        padding:0;
      }

.seg.seg-home a{
        min-width:0;
        flex:1 1 0;
        min-height:clamp(72px,calc(67px + 2.1vw),82px);
        padding:5px 6px 0;
        font-size:22px;
        line-height:1.02;
        letter-spacing:0;
        height:auto;
      }

.seg.seg-home.is-loading a.is-pending::after{width:16px;height:16px;margin-left:7px;border-width:2px;}

.home-mode-status{margin:10px clamp(6px,2.5vw,18px) 0;}
}

@media(max-width:640px) {
.seg.seg-home a{
        font-size:18px;
      }
}

@media(max-width:420px) {
.home-deals-feed{
        border-radius:12px;
      }

.seg.seg-home a{
        padding-inline:4px;
        font-size:14px;
      }

.seg.seg-home.is-loading a.is-pending::after{width:12px;height:12px;margin-left:5px;}
}

@media(max-width:360px) {
.seg.seg-home a{
        padding-inline:3px;
        font-size:13px;
      }

.seg.seg-home.is-loading a.is-pending::after{width:11px;height:11px;margin-left:4px;}
}

@media(max-width:340px) {
.seg.seg-home .seg-track{
        grid-template-columns:minmax(0,1fr);
      }

.seg.seg-home a{
        min-height:48px;
        padding:8px 12px;
        font-size:15px;
        line-height:1.16;
        white-space:normal;
      }

.seg.seg-home a + a{
        box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
      }

.seg.seg-home a.active{
        box-shadow:inset 0 -2px 0 rgba(158,0,10,.10);
      }

.seg.seg-home a.active::before{
        content:none;
      }
}

#homeSections{transition:opacity .2s ease;}

#homeSections.is-loading{opacity:.6;}

body.screen-home .view-home{
      --home-stack-gap:var(--surface-gap-page);
      display:flex;
      flex-direction:column;
      gap:var(--home-stack-gap);
    }

.home-hero-band{
      position:relative;
      display:flow-root;
      margin:0;
      padding-bottom:0;
      z-index:0;
    }

.home-hero-band::before{
      content:"";
      position:absolute;
      top:0;
      left:50%;
      width:100vw;
      transform:translateX(-50%);
      bottom:-16px;
      /*background:#f2ebe4;*/
      z-index:-1;
      pointer-events:none;
    }

.home-hero-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0;}

.home-hero-card{display:flex;justify-content:center;padding:0;background:none;border-radius:0;overflow:visible;}

.home-hero-card img{display:block;width:100%;max-width:522px;height:auto;border-radius:0;}

.home-alert-guide{
      --home-alert-blue:#1f73ed;
      --home-alert-red:#ef4f48;
      --home-alert-amber:#f6a51b;
      --home-alert-green:#20b957;
      container-type:inline-size;
      position:relative;
      z-index:0;
      width:100%;
      max-width:1000px;
      min-width:0;
      margin:0 auto;
      padding:30px clamp(4px,1cqi,8px) 36px;
      border:0;
      border-radius:0;
      background:transparent;
      box-shadow:none;
      overflow:visible;
    }

.home-alert-guide::before{
      content:"";
      position:absolute;
      top:0;
      bottom:0;
      left:50%;
      width:100vw;
      transform:translateX(-50%);
      z-index:-1;
      pointer-events:none;
      background:linear-gradient(180deg,#fff2d4 0%,#f4dfb8 100%);
      border-top:1px solid rgba(177,116,21,.28);
      border-bottom:1px solid rgba(142,91,16,.24);
    }

.home-alert-guide__header{
      max-width:640px;
      margin:0 auto clamp(16px,2.5cqi,24px);
      text-align:center;
    }

.home-alert-guide__title{
      margin:0;
      font-family:var(--font-ui);
      font-size:clamp(30px,9cqi,42px);
      font-weight:900;
      line-height:1.02;
      letter-spacing:0;
      color:#112846;
      text-shadow:0 3px 7px rgba(17,40,70,.11);
    }

.home-alert-guide__subtitle{
      margin:8px 0 0;
      color:#1f314d;
      font-size:clamp(18px,3.6cqi,20px);
      font-weight:400;
      line-height:1.3;
    }

.home-alert-guide__steps{
      display:grid;
      grid-template-columns:repeat(4,minmax(0,1fr));
      gap:clamp(12px,2.2cqi,22px);
      align-items:stretch;
      width:100%;
      max-width:920px;
      min-width:0;
      margin:0 auto;
      padding:0;
      list-style:none;
      counter-reset:home-alert-step;
    }

.home-alert-guide__step{
      --home-alert-accent:var(--home-alert-blue);
      position:relative;
      display:grid;
      align-content:start;
      justify-items:center;
      min-width:0;
      min-block-size:clamp(198px,27cqi,254px);
      padding:clamp(42px,5.2cqi,54px) clamp(8px,1.8cqi,18px) clamp(14px,2cqi,20px);
      border:1px solid var(--surface-border);
      border-radius:var(--surface-radius-primary);
      background:
        linear-gradient(var(--home-alert-accent),var(--home-alert-accent)) top / 100% 10px no-repeat,
        linear-gradient(180deg,var(--surface-bg) 0%, #fbfdff 100%);
      box-shadow:0 8px 20px rgba(15,35,63,.10);
      color:#102540;
    }

.home-alert-guide__step-hitbox{
      position:absolute;
      inset:-1px;
      z-index:2;
      border-radius:inherit;
      cursor:pointer;
    }

.home-alert-guide__step-hitbox:focus-visible{
      outline:3px solid color-mix(in srgb, var(--home-alert-accent), white 26%);
      outline-offset:3px;
    }

.home-alert-guide__step--alert{--home-alert-accent:var(--home-alert-red);}

.home-alert-guide__step--manage{--home-alert-accent:var(--home-alert-amber);}

.home-alert-guide__step--email{--home-alert-accent:var(--home-alert-green);}

.home-alert-guide__step::before{
      counter-increment:home-alert-step;
      content:"STEP " counter(home-alert-step);
      position:absolute;
      z-index:1;
      top:0;
      left:0;
      display:flex;
      align-items:center;
      width:min(58%,104px);
      height:clamp(31px,3.4cqi,35px);
      padding-left:clamp(12px,1.8cqi,18px);
      border-radius:16px 0 12px 0;
      background:
        radial-gradient(circle at 20% 10%, rgba(255,255,255,.3), transparent 34%),
        linear-gradient(135deg, color-mix(in srgb, var(--home-alert-accent), white 12%), color-mix(in srgb, var(--home-alert-accent), black 4%));
      clip-path:polygon(0 0,100% 0,calc(100% - 20px) 100%,0 100%);
      color:#fff;
      font-size:clamp(14px,1.8cqi,18px);
      font-weight:800;
      line-height:1;
      text-align:left;
    }

.home-alert-guide__icon{
      display:grid;
      place-items:center;
      width:clamp(58px,7.4cqi,72px);
      aspect-ratio:1;
      margin-bottom:clamp(8px,1.6cqi,16px);
      border-radius:999px;
      border:7px solid color-mix(in srgb, var(--home-alert-accent), white 74%);
      background:
        radial-gradient(circle at 35% 25%, rgba(255,255,255,.46), transparent 34%),
        linear-gradient(180deg, color-mix(in srgb, var(--home-alert-accent), white 18%), color-mix(in srgb, var(--home-alert-accent), black 8%));
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.42),
        0 12px 26px color-mix(in srgb, var(--home-alert-accent), transparent 68%);
      color:#fff;
    }

.home-alert-guide__icon svg{
      width:52%;
      height:52%;
      stroke:currentColor;
      stroke-width:2.4;
      stroke-linecap:round;
      stroke-linejoin:round;
      fill:none;
    }

.home-alert-guide__icon svg [fill="currentColor"]{stroke:none;}

.home-alert-guide__body{
      display:grid;
      justify-items:center;
      min-width:0;
    }

.home-alert-guide__step-title{
      display:flex;
      align-items:center;
      justify-content:center;
      min-block-size:2.2em;
      font-size:clamp(18px,2.2cqi,22px);
      font-weight:900;
      line-height:1.1;
      text-align:center;
      color:#102540;
    }

.home-alert-guide__copy{
      max-width:clamp(150px,18cqi,180px);
      margin-top:9px;
      color:#4b5d77;
      font-size:18px;
      font-weight:400;
      line-height:1.26;
      text-align:center;
    }

@container (max-width:700px) {
.home-alert-guide__steps{
        grid-template-columns:repeat(2,minmax(0,260px));
        justify-content:center;
      }
}

@media(max-width:720px) {
.home-hero-band{margin-top:0;padding-top:0;}

.home-hero-band::before{bottom:-12px;}

.home-hero-cards{grid-template-columns:minmax(0,1fr);}
}

@media(max-width:340px) {
.home-alert-guide{
        padding:22px 0 28px;
      }

.home-alert-guide__title{
        font-size:29px;
        line-height:1.12;
      }

.home-alert-guide__steps{
        grid-template-columns:minmax(0,1fr);
        gap:12px;
      }

.home-alert-guide__step{
        grid-template-columns:58px minmax(0,1fr);
        column-gap:12px;
        align-items:center;
        justify-items:start;
        min-block-size:0;
        padding:52px 12px 18px;
      }

.home-alert-guide__step::before{
        width:94px;
        height:32px;
        padding-left:12px;
        font-size:15px;
      }

.home-alert-guide__icon{
        width:58px;
        margin:0;
      }

.home-alert-guide__body{
        justify-items:start;
      }

.home-alert-guide__step-title{
        display:block;
        min-block-size:0;
        font-size:20px;
        text-align:left;
      }

.home-alert-guide__copy{
        max-width:none;
        text-align:left;
      }
}

@media(max-width:340px) {
.home-alert-guide__step{
        grid-template-columns:minmax(0,1fr);
        padding:44px 12px 16px;
      }

.home-alert-guide__icon{
        display:none;
      }

.home-alert-guide__step-title{
        line-height:1.12;
      }

.home-alert-guide__copy{
        margin-top:6px;
        font-size:16px;
        line-height:1.25;
      }
}

.home-deals-feed .section{margin:0;}

.view-home .home-empty{
      grid-column:1 / -1;
      min-height:240px;
      padding:24px 26px;
      border-radius:18px;
      border:1px solid var(--category-card-border);
      background:#eef2f7;
      background:linear-gradient(180deg,#f8fafc 0%, #e5e7eb 100%);
      display:grid;
      justify-items:center;
      align-content:center;
      gap:12px;
      text-align:center;
      color:#1f2937;
      position:relative;
      overflow:hidden;
    }

.view-home .home-empty::before{
      content:"";
      position:absolute;
      inset:0;
      background-image:radial-gradient(circle, rgba(15,23,42,0.06) 0 1px, transparent 2px);
      background-size:18px 18px;
      opacity:0.4;
      pointer-events:none;
    }

.view-home .home-empty-art{position:relative;z-index:1;color:#6b7280;}

.view-home .home-empty-art img,
    .view-home .home-empty-art svg{width:120px;height:auto;display:block;}

.view-home .home-empty-body{position:relative;z-index:1;display:grid;gap:6px;justify-items:center;}

.view-home .home-empty-title{font-size:18px;font-weight:700;}

.view-home .home-empty-text{max-width:480px;color:#4b5563;line-height:1.4;}

.view-home .home-empty-link{
      padding:2px 8px;
      margin-top:2px;
      font-size:16px;
      font-weight:700;
      color:#0b5e8d;
    }

.view-home .home-empty-link:focus-visible{
      outline:2px solid rgba(11,94,141,0.35);
      outline-offset:3px;
      border-radius:6px;
    }

@supports (color: color-mix(in srgb, #000, #fff)) {
.view-home .home-empty{
        background:linear-gradient(180deg,
          color-mix(in srgb, var(--category-card-top) 92%, #fff) 0%,
          color-mix(in srgb, var(--category-card-bottom) 85%, #fff) 100%);
      }

.view-home .home-empty-art{
        color:color-mix(in srgb, var(--category-accent) 45%, #6b7280);
      }
}

@media(max-width:640px) {
.view-home .home-empty{min-height:200px;padding:18px 16px;}

.view-home .home-empty-title{font-size:16px;}

.view-home .home-empty-art img,
      .view-home .home-empty-art svg{width:96px;}
}

.home-share-banner{margin:0;padding-top:0;}

.home-share-banner-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-radius:14px;border:2px solid #efb13e;background:linear-gradient(180deg,#fff9e8 0%, #fff2cc 100%);box-shadow:0 10px 22px rgba(146,88,10,.16);max-width:980px;margin:0 auto;}

.home-share-banner-lead{display:flex;align-items:center;gap:12px;min-width:0;flex:1 1 auto;}

.home-share-banner-icon{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:11px;background:#ffe6a6;color:#8a4b00;border:1px solid #f3c969;box-shadow:inset 0 1px 0 rgba(255,255,255,.6);}

.home-share-banner-icon .share-icon{width:18px;height:18px;}

.home-share-banner-icon .share-icon svg{width:18px;height:18px;}

.home-share-banner-copy h2{margin:0 0 4px;font-size:18px;line-height:1.2;color:#1f2937;}

.home-share-banner-copy p{margin:0;font-size:14px;line-height:1.3;color:#4b5563;}

.home-share-banner-actions{display:flex;align-items:center;justify-content:flex-end;flex:0 0 auto;}

.home-share-banner-btn{white-space:nowrap;}

@media(max-width:720px) {
.home-share-banner-inner{flex-direction:column;align-items:flex-start;padding:12px;}

.home-share-banner-actions{justify-content:flex-start;align-self:stretch;width:100%;}

.home-share-banner-btn{display:flex;align-items:center;justify-content:center;width:100%;}
}

.seg.seg-home a{
  --public-hover-accent:var(--seg-bg);
  --public-hover-fill:color-mix(in srgb,var(--seg-bg) 24%,#fff);
  --public-hover-edge:color-mix(in srgb,var(--seg-bg) 36%,#fff);
  --public-hover-ring:color-mix(in srgb,var(--seg-bg) 24%,transparent);
  --public-hover-transform:none;
}