/*
Theme Name: niptonline
Description: Custom theme for niptonline.se
Version: 1.0.0
Author: niptonline.se
*/

:root{
      --cream:#f6efe6;
      --ink:#21243b;
      --body-text:#736c66;
      --rose:#b5677a;
      --rose-hover:#a3576a;
      --rose-deep:#9c5a6c;
      --rose-pale:#f7dfe2;
      --blush:#f7e7e4;
      --mist:#e9ddd3;
      --white:#ffffff;
      --r-pill:9999px;
      --r-card:24px;
      --r-card-sm:16px;
      --font-serif:'Lora',Georgia,'Times New Roman',serif;
      --font-sans:'Manrope',-apple-system,BlinkMacSystemFont,sans-serif;
    }
    *{box-sizing:border-box;}
    body{margin:0;background:var(--cream);color:var(--body-text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;}
    a{color:inherit;text-decoration:none;}
    h1,h2,h3{margin:0;font-family:var(--font-serif);font-weight:600;color:var(--ink);}
    p{margin:0;}
    button{font-family:var(--font-sans);border:none;cursor:pointer;background:none;}
    header{position:sticky;top:0;z-index:100;background:var(--cream);}
    .wrap{max-width:1220px;margin:0 auto;padding:0 32px;}
    .eyebrow{font-family:var(--font-sans);font-weight:700;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--rose);}
    .pill-btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-sans);font-weight:600;font-size:14px;padding:15px 26px;border-radius:var(--r-pill);transition:transform 160ms ease, background-color 160ms ease, color 160ms ease, border-color 160ms ease;}
    .pill-btn:hover{transform:translateY(-2px);}
    .pill-rose{background:var(--rose);color:var(--white);}
    .pill-rose:hover{background:var(--rose-hover);}
    .pill-white{background:var(--white);color:var(--rose-deep);}
    .pill-white:hover{background:var(--blush);}
    .text-link{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:14px;color:var(--ink);border-bottom:1px solid rgba(33,36,59,0.25);padding-bottom:2px;transition:border-color 160ms ease;}
    .text-link:hover{border-color:var(--ink);}
    .icon-chip{width:56px;height:56px;border-radius:50%;background:var(--rose-pale);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
    .card-lift{transition:transform 200ms ease, border-color 200ms ease;}
    .card-lift:hover{transform:translateY(-4px);}
    .reveal{opacity:0;transform:translateY(24px);transition:opacity 650ms ease, transform 650ms ease;}
    .reveal.in-view{opacity:1;transform:translateY(0);}
    .nav-link{font-size:14px;font-weight:500;color:var(--ink);opacity:0.72;transition:opacity 160ms ease;}
    .nav-link:hover{opacity:1;}
    .faq-item{border-top:1px solid var(--mist);}
    .faq-item:last-child{border-bottom:1px solid var(--mist);}
    .faq-q{cursor:pointer;user-select:none;}
    .faq-chevron{transition:transform 220ms ease;}
    #kit-img-open{will-change:opacity;}
    .kit-stage img{
      -webkit-mask-image:radial-gradient(ellipse 62% 62% at center, black 45%, transparent 92%);
      mask-image:radial-gradient(ellipse 62% 62% at center, black 45%, transparent 92%);
    }
    @keyframes heroIn{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}
    .hero-anim-1{animation:heroIn 700ms ease both;}
    .hero-anim-2{animation:heroIn 700ms ease 120ms both;}
    .hero-anim-3{animation:heroIn 700ms ease 240ms both;}
    .cmp-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;}
    table.cmp{width:100%;border-collapse:collapse;min-width:760px;}
    table.cmp th, table.cmp td{padding:13px 10px;text-align:center;font-size:13px;border-bottom:1px solid var(--mist);}
    table.cmp .cmp-label{text-align:left;font-size:13.5px;color:var(--ink);padding-left:6px;}
    table.cmp thead th{font-family:var(--font-serif);vertical-align:top;padding-top:20px;padding-bottom:16px;border-bottom:2px solid var(--mist);position:sticky;top:92px;z-index:5;background:var(--cream);}
    table.cmp thead th .cmp-tier-name{font-size:17px;font-weight:600;color:var(--ink);}
    table.cmp thead th .cmp-sub{margin-top:4px;font-family:var(--font-sans);font-size:10px;font-weight:700;letter-spacing:0.08em;text-transform:uppercase;color:var(--rose);}
    table.cmp thead th .cmp-price{margin-top:10px;font-family:var(--font-sans);font-size:13px;font-weight:600;color:var(--body-text);}
    table.cmp thead th.featured{background:var(--rose-pale);}
    table.cmp td.featured{background:rgba(181,103,122,0.07);}
    .cmp-section td{background:var(--mist);font-family:var(--font-sans);font-weight:700;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;color:var(--rose-deep);padding:10px 10px;text-align:left;border-bottom:none;}
    .cmp-check{color:var(--rose);font-size:16px;font-weight:700;}
    .cmp-dash{color:var(--mist);}
    .cmp-note{font-size:12px;font-weight:600;color:var(--ink);}
    .cmp-foot p + p{margin-top:8px;}
    @media (max-width: 980px){
      .wrap{padding:0 20px;}
      .hero-grid{grid-template-columns:1fr !important;}
      .hero-photo-col{order:-1;height:320px !important;}
      .steps-photo-row{flex-direction:column !important;align-items:stretch !important;max-width:280px !important;}
      .step-arrow{display:none !important;}
      .usp-grid{grid-template-columns:1fr 1fr !important;}
      .tier-grid{grid-template-columns:1fr 1fr !important;}
      .bottom-grid{grid-template-columns:1fr !important;}
      .bottom-photo-col{order:-1;height:280px !important;width:280px !important;margin:0 auto;}
      .nav-links{display:none !important;}
      .display-h{font-size:38px !important;line-height:1.12 !important;}
      .heading-lg{font-size:30px !important;}
    }
    @media (max-width: 560px){
      .usp-grid{grid-template-columns:1fr !important;}
      .tier-grid{grid-template-columns:1fr !important;}
      .footer-grid{grid-template-columns:1fr !important;gap:32px !important;}
    }
    @media (max-width: 760px){
      table.cmp{min-width:680px;}
    }
    #mobile-sticky-cta{
      display:none;
      position:fixed;left:0;right:0;bottom:0;z-index:200;
      background:var(--cream);
      border-top:1px solid var(--mist);
      padding:12px 20px calc(12px + env(safe-area-inset-bottom));
      box-shadow:0 -6px 20px rgba(33,36,59,0.08);
      transform:translateY(100%);
      transition:transform 220ms ease;
    }
    #mobile-sticky-cta.visible{transform:translateY(0);}
    @media (max-width: 760px){
      #mobile-sticky-cta{display:block;}
    }

/* --- extra styles from om-nipt.html --- */
.content p + p{margin-top:14px;}

/* --- extra styles from sa-gar-det-till.html --- */
.timeline-circle{background:var(--mist);color:var(--body-text);}
  .timeline-step.completed .timeline-circle{background:var(--rose);color:var(--white);}
  .timeline-step.active .timeline-circle{background:var(--rose);color:var(--white);transform:scale(1.14);}
  .timeline-step.active .timeline-label{color:var(--ink);}
  .timeline-step.completed .timeline-label{color:var(--ink);}
  .panel-fade{transition:opacity 220ms ease;}
  @media (max-width: 760px){
    .timeline-row{grid-template-columns:repeat(3,1fr) !important;row-gap:28px;margin-top:20px !important;}
    .timeline-line-base, .timeline-line-fill{display:none;}
    .timeline-panel{grid-template-columns:1fr !important;margin-top:20px !important;}
    .timeline-panel-img{height:180px !important;}
    .timeline-sticky{height:auto !important;min-height:0 !important;max-height:none !important;padding-top:12px !important;padding-bottom:24px !important;}
  }

/* --- extra styles from vanliga-fragor.html --- */
.faq-item{border-top:1px solid var(--mist);}
  .faq-item:last-child{border-bottom:1px solid var(--mist);}
  .faq-chevron{transition:transform 220ms ease;}
  .faq-item.open .faq-chevron{transform:rotate(180deg);stroke:var(--rose);}
  .faq-item.open .faq-a{display:block !important;}
