/* ============================================================================
   Capturr Studio — site styles
   ----------------------------------------------------------------------------
   Layout lives in inline style attributes on the markup (intentional: the
   design was authored that way). This file holds only what cannot be inline:
   resets, responsive rules and hover states.

   Sections:
     1. Base & resets
     2. Responsive (<=1024px tablet, <=760px phone, <=480px small phone)
     3. Hover states (.hv-*) — generated pairs for elements with a hover style
   ========================================================================= */

/* 1–2. Base, resets and responsive rules ---------------------------------- */
*{box-sizing:border-box;}
  html,body{margin:0;padding:0;}
  body{background:#efeeea;}
  a{color:#111;text-decoration:none;}
  a:hover{color:#555;}
  ::selection{background:#111;color:#efeeea;}
  img,image-slot{max-width:100%;}
  [data-soc] img{transition:filter .35s cubic-bezier(.2,.8,.2,1);}
  [data-soc]:hover img{filter:invert(1) brightness(2);}
  [data-burger]{display:none;}

  @media (max-width:1024px){
    [data-story-grid]{grid-template-columns:1fr !important;gap:44px !important;}
    [data-team-grid]{grid-template-columns:1fr !important;gap:36px !important;padding-top:20px !important;}
    [data-moments-grid]{gap:16px !important;}
    [data-moments-grid] > div{gap:60px !important;}
    [data-foot]{grid-template-columns:1fr 1fr !important;}
  }

  @media (max-width:760px){
    section{padding-left:20px !important;padding-right:20px !important;}
    [data-hdr]{padding:14px 20px !important;}
    [data-nav]{display:none !important;}
    [data-hdr] [data-btn]{display:none !important;}
    [data-burger]{display:flex !important;}

    [data-hero-grid]{grid-template-columns:repeat(2,1fr) !important;grid-template-rows:none !important;gap:10px !important;}
    [data-hero-grid] > div{grid-column:auto !important;grid-row:auto !important;height:44vw;}
    [data-hero-grid] > div:first-child{grid-column:1/3 !important;height:80vw;}

    [data-intro] p{max-width:100% !important;text-align:left !important;margin:0 0 40px !important;font-size:19px !important;}

    [data-story-grid]{grid-template-columns:1fr !important;gap:36px !important;}
    [data-stats]{gap:36px !important;margin-top:34px !important;}

    [data-banner-inner]{padding:44px 20px !important;min-height:0 !important;}
    [data-banner-inner] h2{text-align:left !important;font-size:30px !important;max-width:100% !important;margin-left:0 !important;}
    [data-banner-row]{flex-direction:column !important;align-items:flex-start !important;gap:26px !important;margin-top:30px !important;}

    [data-svc-head]{flex-direction:column !important;gap:18px !important;margin-bottom:34px !important;}
    [data-row]{grid-template-columns:52px 1fr !important;gap:6px 14px !important;padding:20px 0 !important;}
    [data-row] > div:last-child{grid-column:2/3 !important;font-size:15px !important;}
    [data-row-title]{font-size:26px !important;}
    #cs-preview{display:none !important;}

    [data-team-imgs]{grid-template-columns:1fr 1fr !important;gap:12px !important;}
    [data-team-imgs] > div{padding-bottom:0 !important;}

    [data-moments-head]{flex-direction:column !important;gap:20px !important;margin-bottom:44px !important;padding-top:30px !important;}
    [data-moments-head] p{max-width:100% !important;text-align:left !important;}
    [data-moments-grid]{gap:10px !important;}
    [data-moments-grid] > div{gap:34px !important;margin-top:0 !important;}
    [data-moments-grid] > div:nth-child(n+4){display:none !important;}

    [data-foot]{grid-template-columns:1fr !important;gap:30px !important;padding:44px 20px 30px !important;}
    [data-footbar]{padding:18px 20px 28px !important;}
    [data-guides]{display:none !important;}
  }

  @media (max-width:480px){
    [data-moments-grid] > div:nth-child(n+3){display:none !important;}
  }

  @media (max-width:1024px){
    [data-svc-steps]{grid-template-columns:1fr 1fr !important;}
    [data-packs]{grid-template-columns:1fr !important;}
    [data-packs] > div{padding:32px 0 !important;border-left:none !important;border-top:1px solid rgba(0,0,0,0.16);}
  }
  @media (max-width:760px){
    [data-svc-steps]{grid-template-columns:1fr !important;gap:0 !important;}
    [data-stats]{grid-template-columns:1fr !important;}
    [data-stats] > div{padding:26px 0 !important;border-left:none !important;border-top:1px solid rgba(0,0,0,0.16);}
    [data-cform]{grid-template-columns:1fr !important;}
  }

  [data-fsoc]:hover img{filter:none !important;}
  @media (max-width:1024px){
    [data-foot]{grid-template-columns:1fr 1fr !important;}
    [data-foot-top]{grid-template-columns:1fr !important;gap:36px !important;align-items:start !important;}
  }
  @media (max-width:760px){
    [data-foot]{grid-template-columns:1fr !important;gap:32px !important;padding:40px 20px 44px !important;}
    [data-foot-top]{padding:56px 20px 40px !important;}
  }

  @keyframes cap-marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
  [data-fmail]:hover [data-farrow]{transform:translate(5px,-5px);}
  @media (max-width:1024px){
    [data-foot]{grid-template-columns:1fr !important;gap:44px !important;}
  }
  @media (max-width:760px){
    [data-foot]{padding:52px 20px 40px !important;}
    [data-fcols]{grid-template-columns:1fr 1fr !important;gap:26px !important;}
    [data-fmark]{padding:0 !important;}
    [data-footbar]{padding:24px 20px 32px !important;}
  }

/* 3. Hover states --------------------------------------------------------- */
.hv-1:hover{transform:scale(1.05) !important;}
.hv-2:hover{transform:scale(1.04) !important;}
.hv-3:hover{background:#111 !important; border-color:#111 !important; transform:translateY(-4px) !important;}
.hv-4:hover{border-color:#efeeea !important; opacity:1 !important;}
.hv-5:hover{color:#efeeea !important;}
.hv-6:hover{background:#efeeea !important; border-color:#efeeea !important; transform:translateY(-4px) !important;}