/* SquareOffs · shared page styles (scoped #sqo-home). Keep fonts/ next to this file. */
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 100; src: url("./fonts/ProximaNova-Thin.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 100; src: url("./fonts/ProximaNova-ThinIt.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 300; src: url("./fonts/ProximaNova-Light.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 300; src: url("./fonts/ProximaNova-LightItalic.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 400; src: url("./fonts/ProximaNova-Regular.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 400; src: url("./fonts/ProximaNova-RegularItalic.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 600; src: url("./fonts/ProximaNova-Semibold.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 600; src: url("./fonts/ProximaNova-SemiboldItalic.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 700; src: url("./fonts/ProximaNova-Bold.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 700; src: url("./fonts/ProximaNova-BoldIt.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 800; src: url("./fonts/ProximaNova-Extrabold.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 800; src: url("./fonts/ProximaNova-ExtraboldIt.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: normal; font-weight: 900; src: url("./fonts/ProximaNova-Black.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova"; font-style: italic; font-weight: 900; src: url("./fonts/ProximaNova-BlackIt.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 300; src: url("./fonts/ProximaNovaCond-Light.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 400; src: url("./fonts/ProximaNovaCond-Regular.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 600; src: url("./fonts/ProximaNovaCond-Semibold.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 700; src: url("./fonts/ProximaNovaCond-Bold.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 800; src: url("./fonts/ProximaNovaCond-Extrabld.otf") format("opentype"); font-display: swap; }
@font-face{ font-family: "Proxima Nova Condensed"; font-style: normal; font-weight: 900; src: url("./fonts/ProximaNovaCond-Black.otf") format("opentype"); font-display: swap; }
:root{
  
  
  --so-teal:        #00AD94;   
  --so-teal-dark:   #208978;   
  --so-coral:       #F05C52;   
  --so-coral-dark:  #CE3D39;   

  
  --so-teal-50:     #E6F7F4;
  --so-teal-100:    #C0EAE2;
  --so-coral-50:    #FDECEA;
  --so-coral-100:   #FBC9C4;

  
  
  --so-ink:         #1A1A1A;   
  --so-graphite:    #353C42;   
  --so-slate:       #5A6470;   
  --so-mist:        #8A95A1;   
  --so-fog:         #C7CED6;   
  --so-cloud:       #E5E9EE;   
  --so-paper:       #F5F7FA;   
  --so-snow:        #FBFCFD;   
  --so-white:       #FFFFFF;

  
  --bg:             var(--so-white);
  --bg-muted:       var(--so-paper);
  --bg-inverse:     var(--so-graphite);
  --fg-1:           var(--so-ink);     
  --fg-2:           var(--so-graphite);
  --fg-3:           var(--so-slate);   
  --fg-4:           var(--so-mist);    
  --fg-on-color:    var(--so-white);   
  --border:         var(--so-cloud);
  --border-strong:  var(--so-fog);
  --link:           var(--so-teal-dark);
  --link-hover:     var(--so-teal);

  
  --success: #1FAB68;
  --warning: #E8A23B;
  --danger:  var(--so-coral-dark);
  --info:    #2E7BD3;

  
  
  --grad-squareoff: linear-gradient(90deg, var(--so-teal) 0%, var(--so-teal) 50%, var(--so-coral) 50%, var(--so-coral) 100%);
  
  --grad-diamond: conic-gradient(from 45deg, var(--so-teal) 0deg 90deg, var(--so-coral) 90deg 180deg, var(--so-coral-dark) 180deg 270deg, var(--so-teal-dark) 270deg 360deg);
  
  --grad-teal:         linear-gradient(135deg, #1AC4A8 0%, #00AD94 50%, #1A7768 100%);
  --grad-teal-subtle:  linear-gradient(135deg, var(--so-teal) 0%, var(--so-teal-dark) 100%);
  --grad-coral:        linear-gradient(135deg, #F58177 0%, #F05C52 50%, #B7332E 100%);
  --grad-coral-subtle: linear-gradient(135deg, var(--so-coral) 0%, var(--so-coral-dark) 100%);
  
  --grad-blend: linear-gradient(135deg, var(--so-teal) 0%, var(--so-coral) 100%);

  
  --font-sans: "Proxima Nova", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  --font-display: "Proxima Nova Condensed", "Proxima Nova", "Oswald", "Inter", system-ui, sans-serif;
  --font-mono: ui-monospace, "SF Mono", "Menlo", "Consolas", monospace;

  
  --t-2xs:  11px;
  --t-xs:   12px;
  --t-sm:   14px;
  --t-base: 16px;
  --t-md:   18px;
  --t-lg:   20px;
  --t-xl:   24px;
  --t-2xl:  30px;
  --t-3xl:  36px;
  --t-4xl:  48px;
  --t-5xl:  64px;
  --t-6xl:  84px;
  --t-7xl: 112px;  

  --lh-tight:  1.05;
  --lh-snug:   1.20;
  --lh-normal: 1.45;
  --lh-loose:  1.65;

  --tracking-display: -0.02em;   
  --tracking-tight:   -0.01em;
  --tracking-normal:  0;
  --tracking-wide:    0.04em;
  --tracking-caps:    0.12em;    

  
  --space-0:  0;
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-7:  32px;
  --space-8:  40px;
  --space-9:  48px;
  --space-10: 64px;
  --space-11: 80px;
  --space-12: 96px;
  --space-13: 128px;

  
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 20px;
  --radius-2xl: 28px;
  --radius-pill: 999px;

  
  --shadow-1: 0 1px 2px rgba(20, 28, 38, 0.06), 0 1px 1px rgba(20, 28, 38, 0.04);
  --shadow-2: 0 4px 12px rgba(20, 28, 38, 0.08), 0 1px 2px rgba(20, 28, 38, 0.05);
  --shadow-3: 0 12px 32px rgba(20, 28, 38, 0.10), 0 2px 6px rgba(20, 28, 38, 0.05);
  --shadow-4: 0 24px 60px rgba(20, 28, 38, 0.14), 0 4px 12px rgba(20, 28, 38, 0.06);
  --shadow-teal:  0 12px 28px -10px rgba(6, 176, 150, 0.55);
  --shadow-coral: 0 12px 28px -10px rgba(241, 92, 82, 0.55);
  --inner-hairline: inset 0 0 0 1px rgba(255,255,255,0.18);

  
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --dur-fast:   120ms;
  --dur-base:   200ms;
  --dur-slow:   360ms;

  
  --container-narrow:  720px;
  --container-default: 1120px;
  --container-wide:    1280px;
  --container-bleed:   1440px;
}
#sqo-home{ -webkit-text-size-adjust: 100%; }
#sqo-home{
  margin: 0;
  background: var(--bg);
  color: var(--fg-2);
  font-family: var(--font-sans);
  font-size: var(--t-base);
  line-height: var(--lh-normal);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
#sqo-home h1,#sqo-home .h1{
  font-family: var(--font-display);
  font-weight: 800;
  font-size: clamp(var(--t-4xl), 5.6vw, var(--t-7xl));
  line-height: var(--lh-tight);
  letter-spacing: var(--tracking-display);
  color: var(--fg-1);
  margin: 0 0 var(--space-5) 0;
}
#sqo-home h2,#sqo-home .h2{
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(var(--t-3xl), 3.6vw, var(--t-5xl));
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-display);
  color: var(--fg-1);
  margin: 0 0 var(--space-4) 0;
}
#sqo-home h3,#sqo-home .h3{
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--t-2xl);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-tight);
  color: var(--fg-1);
  margin: 0 0 var(--space-3) 0;
}
#sqo-home h4,#sqo-home .h4{
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--t-xl);
  line-height: var(--lh-snug);
  color: var(--fg-1);
  margin: 0 0 var(--space-3) 0;
}
#sqo-home h5,#sqo-home .h5{
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--t-lg);
  line-height: var(--lh-snug);
  color: var(--fg-1);
  margin: 0 0 var(--space-2) 0;
}
#sqo-home h6,#sqo-home .h6{
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--t-sm);
  line-height: var(--lh-snug);
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--fg-3);
  margin: 0 0 var(--space-2) 0;
}
#sqo-home p{
  margin: 0 0 var(--space-4) 0;
  font-size: var(--t-base);
  line-height: var(--lh-normal);
  color: var(--fg-2);
  text-wrap: pretty;
}
#sqo-home .lead{
  font-size: var(--t-md);
  line-height: var(--lh-normal);
  color: var(--fg-2);
}
#sqo-home .eyebrow{
  display: inline-block;
  font-size: var(--t-xs);
  font-weight: 700;
  letter-spacing: var(--tracking-caps);
  text-transform: uppercase;
  color: var(--so-teal-dark);
}
#sqo-home .eyebrow.coral{ color: var(--so-coral-dark); }
#sqo-home small,#sqo-home .small{ font-size: var(--t-sm); color: var(--fg-3); }
#sqo-home .caption{ font-size: var(--t-xs); color: var(--fg-4); }
#sqo-home code,#sqo-home kbd,#sqo-home samp,#sqo-home pre{
  font-family: var(--font-mono);
  font-size: 0.92em;
}
#sqo-home code{ background: var(--so-paper); padding: 0.1em 0.35em; border-radius: var(--radius-xs); }
#sqo-home a{
  color: var(--link);
  text-decoration-thickness: 1.5px;
  text-underline-offset: 2px;
  transition: color var(--dur-fast) var(--ease-out);
}
#sqo-home a:hover{ color: var(--link-hover); }
#sqo-home hr{
  border: 0;
  border-top: 1px solid var(--border);
  margin: var(--space-7) 0;
}
#sqo-home ::selection{ background: var(--so-teal); color: white; }

:root{ color-scheme: light; }
#sqo-home,#sqo-home{ margin: 0; padding: 0; background: var(--so-white); color: var(--fg-2); }
#sqo-home *{ box-sizing: border-box; }
#sqo-home .section{ padding: 60px 60px; position: relative; }
#sqo-home .section.tight{ padding: 40px 60px; }
#sqo-home .section.dark{ background: var(--so-graphite); color: white; }
#sqo-home .section.ink{ background: var(--so-ink); color: white; }
#sqo-home .section.paper{ background: var(--so-paper); }
#sqo-home .section.split-tint{ background:
  linear-gradient(90deg, rgba(6,176,150,0.05) 0%, rgba(6,176,150,0.05) 50%, rgba(241,92,82,0.05) 50%, rgba(241,92,82,0.05) 100%); }
#sqo-home .container{ max-width: 1200px; margin: 0 auto; }
#sqo-home .container.narrow{ max-width: 880px; }
#sqo-home .container.wide{ max-width: 1320px; }
#sqo-home .center{ text-align: center; }
#sqo-home .eyebrow{
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 12px; font-weight: 800; letter-spacing: 0.14em;
  text-transform: uppercase; color: var(--so-teal-dark); margin-bottom: 14px;
  white-space: nowrap;
}
#sqo-home .eyebrow .dot{ width: 8px; height: 8px; background: var(--grad-squareoff); transform: rotate(45deg); }
#sqo-home .eyebrow.coral{ color: var(--so-coral-dark); }
#sqo-home .eyebrow.on-dark{ color: var(--so-teal); }
#sqo-home h2.section-h{
  font-family: var(--font-display); font-weight: 800;
  font-size: clamp(40px, 4.4vw, 64px); line-height: 1.04; letter-spacing: -0.02em;
  color: var(--fg-1); margin: 0 0 18px;
}
#sqo-home .section.dark h2.section-h,#sqo-home .section.ink h2.section-h{ color: white; }
#sqo-home p.section-lead{
  font-size: 19px; line-height: 1.55; color: var(--fg-2); max-width: 680px;
  margin: 0 0 36px;
}
#sqo-home .section.dark p.section-lead,#sqo-home .section.ink p.section-lead{ color: rgba(255,255,255,0.78); }
#sqo-home .section.center p.section-lead,#sqo-home .section.center h2.section-h{ margin-left: auto; margin-right: auto; }
#sqo-home .btn{
  font-family: var(--font-sans); font-weight: 700; font-size: 15px;
  padding: 14px 24px; border-radius: 10px; border: 0; cursor: pointer; line-height: 1;
  display: inline-flex; align-items: center; gap: 8px;
  transition: transform .18s var(--ease-out), background .18s var(--ease-out), box-shadow .18s var(--ease-out);
  text-decoration: none; white-space: nowrap;
}
#sqo-home .btn:hover{ transform: translateY(-1px); }
#sqo-home .btn:active{ transform: translateY(0) scale(0.98); }
#sqo-home .btn-lg{ padding: 16px 28px; font-size: 16px; border-radius: 12px; }
#sqo-home .btn-teal{ background: var(--so-teal); color: white; box-shadow: var(--shadow-teal); border: 2px solid transparent; }
#sqo-home .btn-teal:hover{ background: var(--so-teal-dark); }
#sqo-home .btn-coral{ background: var(--so-coral); color: white; box-shadow: var(--shadow-coral); border: 2px solid transparent; }
#sqo-home .btn-coral:hover{ background: var(--so-coral-dark); }
#sqo-home .btn-ink{ background: var(--so-ink); color: white; border: 2px solid transparent; }
#sqo-home .btn-ink:hover{ background: var(--so-graphite); }
#sqo-home .btn-ghost-dark{
  background: transparent; color: var(--so-graphite); border: 2px solid var(--so-graphite);
}
#sqo-home .btn-ghost-dark:hover{ background: var(--so-graphite); color: white; }
#sqo-home .btn-ghost-light{ background: transparent; color: white; border: 2px solid rgba(255,255,255,0.55); }
#sqo-home .btn-ghost-light:hover{ background: rgba(255,255,255,0.12); border-color: white; }
#sqo-home .btn-light{ background: white; color: var(--so-graphite); border: 2px solid transparent; }
#sqo-home .btn-light:hover{ background: var(--so-paper); }
#sqo-home .diamond-bullet{ display: inline-block; width: 10px; height: 10px; background: var(--grad-squareoff); transform: rotate(45deg); }
#sqo-home .field{ display: flex; flex-direction: column; gap: 6px; }
#sqo-home .field label{ font-size: 13px; font-weight: 700; color: var(--fg-2); letter-spacing: 0.01em; }
#sqo-home .field label .req{ color: var(--so-coral); }
#sqo-home .field input,#sqo-home .field select,#sqo-home .field textarea{
  font-family: var(--font-sans); font-size: 15px; color: var(--fg-1);
  background: white; border: 1.5px solid var(--border-strong);
  border-radius: 10px; padding: 12px 14px; outline: 0;
  transition: border-color .15s var(--ease-out), box-shadow .15s var(--ease-out);
}
#sqo-home .field input::placeholder,#sqo-home .field textarea::placeholder{ color: var(--fg-4); }
#sqo-home .field input:focus,#sqo-home .field select:focus,#sqo-home .field textarea:focus{
  border-color: var(--so-teal);
  box-shadow: 0 0 0 3px rgba(6,176,150,0.22);
}
#sqo-home .field.error input{ border-color: var(--so-coral); }
#sqo-home .field .err{ color: var(--so-coral-dark); font-size: 12px; font-weight: 600; }
#sqo-home .chip{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 6px 12px; border-radius: 999px;
  font-size: 12px; font-weight: 700; letter-spacing: 0.04em;
  background: white; color: var(--so-graphite); border: 1px solid var(--border);
}
#sqo-home .chip.teal{ background: var(--so-teal-50); color: var(--so-teal-dark); border-color: var(--so-teal-100); }
#sqo-home .chip.coral{ background: var(--so-coral-50); color: var(--so-coral-dark); border-color: var(--so-coral-100); }
#sqo-home .chip.ink{ background: rgba(255,255,255,0.08); color: white; border-color: rgba(255,255,255,0.18); }
#sqo-home .hairline{ height: 1px; background: var(--border); }
#sqo-home .kicker-line{ display: flex; align-items: center; gap: 12px; font-size: 12px; color: var(--fg-4); text-transform: uppercase; letter-spacing: 0.16em; font-weight: 700; }
#sqo-home .kicker-line::before,#sqo-home .kicker-line::after{ content: ""; flex: 1; height: 1px; background: var(--border); }
@keyframes fadeUp{ from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: none; } }
#sqo-home .in-view{ animation: fadeUp .6s var(--ease-out) both; }
#sqo-home .so-featured-logo{ bottom: -6px !important; }
@media (max-width: 900px){#sqo-home .section{ padding: 48px 24px; }
#sqo-home .section.tight{ padding: 32px 24px; }
#sqo-home header .nav-desktop,#sqo-home header .nav-desktop-cta{ display: none !important; }
#sqo-home header .nav-mobile-toggle{ display: inline-flex !important; align-items: center; justify-content: center; }
#sqo-home .section [style*="grid-template-columns"],#sqo-home #top [style*="grid-template-columns"],#sqo-home header [style*="grid-template-columns"],#sqo-home footer [style*="grid-template-columns"]{
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
#sqo-home #pillars + section [style*="grid-template-columns"]:not(:has(*)),#sqo-home section.section.ink [style*="grid-template-columns"]{
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 24px !important;
  }
#sqo-home section.section.ink [style*="grid-template-columns"] > div{
    text-align: center;
  }
#sqo-home section.section.ink [style*="grid-template-columns"] > div > div[style*="position: absolute"]{
    left: 50% !important;
    transform: translateX(-50%) !important;
  }
#sqo-home footer .container > div[style*="grid-template-columns"]{
    grid-template-columns: 1fr 1fr !important;
    gap: 32px !important;
  }
#sqo-home section > div > div[style*="translateX"],#sqo-home section .hero-embed-wrapper{
    transform: none !important;
    top: 0 !important;
    margin-top: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }
#sqo-home section > div > div[style*="translateX"] > div,#sqo-home section .hero-embed-wrapper > div{ width: 100% !important; max-width: 100% !important; }
#sqo-home section > div > div[style*="translateX"] > div[style*="transform: rotate"],#sqo-home section .hero-embed-wrapper > div[style*="transform: rotate"]{
    display: none !important;
  }
#sqo-home section .hero-embed-wrapper{
    display: flex !important;
    justify-content: center !important;
  }
#sqo-home [style*="grid-template-columns: 1fr 1fr"][style*="background"][style*="#D8DCE2"]{
    grid-template-columns: 1fr 1fr !important;
    gap: 2px !important;
  }
#sqo-home section[style*="border-top: 1px solid var(--border)"][style*="border-bottom"] > div > div[style*="grid-template-columns"] > div:nth-child(n+5){
    display: none !important;
  }
#sqo-home h1,#sqo-home .h1{ font-size: clamp(40px, 8vw, 56px) !important; }
#sqo-home h2.section-h{ font-size: clamp(32px, 6.5vw, 44px) !important; }
#sqo-home p.section-lead{ font-size: 17px; }
#sqo-home #recipe div[style*="padding-top: 90px"],#sqo-home #recipe div[style*="padding-top: 36px"],#sqo-home #recipe div[style*="paddingTop"]{
    padding-top: 0 !important;
  }
#sqo-home .so-embed-comments{ display: none !important; }
#sqo-home #recipe div[style*="grid-template-columns: 1fr 290px"] > aside,#sqo-home #recipe div[style*="grid-template-columns: 1fr 200px"] > div:last-child,#sqo-home #recipe div[style*="grid-template-columns: 240px 1fr"] > div:first-child{
    display: none !important;
  }
#sqo-home #recipe div[style*="border-bottom: 1px solid var(--border)"][style*="background: var(--so-paper)"],#sqo-home #recipe div[style*="background: var(--so-ink)"][style*="padding"]:not([style*="border-radius: 12px"]),#sqo-home #recipe div[style*="border-bottom: 1px solid var(--border)"][style*="padding: 20px 24px 14px"],#sqo-home #recipe div[style*="padding: '0 18px 18px'"],#sqo-home #recipe div[style*="padding: 0 18px 18px"]{
    display: none !important;
  }
#sqo-home #recipe div[style*="grid-template-columns: 1fr 200px"],#sqo-home #recipe div[style*="grid-template-columns: 1fr 290px"],#sqo-home #recipe div[style*="grid-template-columns: 240px 1fr"]{
    grid-template-columns: 1fr !important;
    padding: 16px !important;
    gap: 0 !important;
  }
#sqo-home .recipe-tabs{
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 8px !important;
    margin-bottom: 20px !important;
  }
#sqo-home .recipe-tab{
    padding: 12px 8px !important;
    grid-template-columns: 1fr !important;
    justify-items: center !important;
    text-align: center !important;
    gap: 4px !important;
  }
#sqo-home .recipe-tab > div:first-child{ font-size: 22px !important; }
#sqo-home .recipe-tab > div:last-child > div:first-child{ font-size: 12px !important; line-height: 1.15; }
#sqo-home .recipe-tab > div:last-child > div:last-child{ display: none !important; }
#sqo-home #integrations div[style*="position: sticky"],#sqo-home #demo div[style*="position: sticky"]{
    position: static !important;
    top: auto !important;
  }
}
@media (max-width: 600px){#sqo-home .section{ padding: 40px 18px; }
#sqo-home .section.tight{ padding: 28px 18px; }
#sqo-home .so-featured-logo{ bottom: -6px !important; }
#sqo-home section.section.ink [style*="grid-template-columns"]{
    grid-template-columns: 1fr !important;
  }
#sqo-home footer .container > div[style*="grid-template-columns"]{
    grid-template-columns: 1fr !important;
    gap: 24px !important;
  }
#sqo-home .btn-lg{ padding: 14px 22px; font-size: 15px; }
#sqo-home section .hero-embed-wrapper > div{
    width: 300px !important;
    max-width: 300px !important;
    margin: 0 auto !important;
  }
#sqo-home h1,#sqo-home .h1{ font-size: clamp(34px, 9vw, 44px) !important; }
#sqo-home h2.section-h{ font-size: clamp(28px, 7.5vw, 36px) !important; }
#sqo-home p.section-lead{ font-size: 16px; }
#sqo-home .eyebrow{ white-space: normal; }
#sqo-home section[style*="grad-squareoff"] > div[style*="position: absolute"][style*="left: 50%"]{
    display: none !important;
  }
#sqo-home section[style*="grad-squareoff"] > div.container > div:first-child{
    display: none !important;
  }
#sqo-home section[style*="grad-squareoff"] > div.container{
    grid-template-columns: 1fr !important;
    justify-items: center;
  }
#sqo-home section[style*="border-top: 1px solid var(--border)"][style*="border-bottom"] > div > div[style*="grid-template-columns"]{
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 16px !important;
  }
#sqo-home section[style*="border-top: 1px solid var(--border)"][style*="border-bottom"] > div > div[style*="grid-template-columns"] > div:nth-child(n+4){
    display: none !important;
  }
}

#sqo-home .so-card{
  container-type: inline-size;
  width: 460px;                 
  max-width: 100%;
  font-family: var(--font-sans, "Proxima Nova", system-ui, sans-serif);
  color: #1A2030;
  background: #F0F2F5;
  border: 1px solid #D8DCE2;
  border-radius: 4px;           
  overflow: hidden;
  line-height: 1.3;
  text-align: left;
}
#sqo-home .so-card__hero{
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #cfd6de center/cover no-repeat;
}
#sqo-home .so-card__hero::after{
  content: "";
  position: absolute; left: 0; right: 0; bottom: 0; height: 42%;
  background: linear-gradient(to top, rgba(0,0,0,0.6), rgba(0,0,0,0));
}
#sqo-home .so-card__avatar{
  position: absolute;
  left: 2.6cqw; bottom: -5.6cqw;
  width: 10cqw; height: 10cqw;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-display, "Proxima Nova", sans-serif);
  font-weight: 900; font-size: 2.8cqw; color: #1A1A1A;
  z-index: 2; overflow: hidden;
}
#sqo-home .so-card__avatar img{ width: 100%; height: 100%; object-fit: cover; }
#sqo-home .so-card__askedby{
  position: absolute; left: 14.3cqw; bottom: 1.3cqw; z-index: 2; white-space: nowrap;
  color: #fff; font-size: 3.04cqw; letter-spacing: -0.01em;
  text-shadow: 0 1px 3px rgba(0,0,0,0.7);
}
#sqo-home .so-card__askedby em{ font-style: italic; font-weight: 400; opacity: 0.95; }
#sqo-home .so-card__askedby strong{ font-weight: 700; }
#sqo-home .so-card__votes{
  position: absolute; right: 3.04cqw; bottom: 1.3cqw; z-index: 2; white-space: nowrap;
  color: #fff; font-size: 3.04cqw; font-weight: 600;
  display: inline-flex; align-items: center; gap: 1.3cqw;
  text-shadow: 0 1px 3px rgba(0,0,0,0.7);
}
#sqo-home .so-card__check{ width: 3.48cqw; height: auto; display: block; }
#sqo-home .so-card__q{
  background: #EBEDF0;
  padding: 3.6cqw 14cqw;
  min-height: 16.5cqw;
  display: flex; align-items: center; justify-content: center;
  text-align: center;
  font-size: 4.04cqw;
  font-weight: 400;
  color: #4a4f55;
  line-height: 1.3;
  letter-spacing: -0.005em;
}
#sqo-home .so-card__bars{ display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: #fff; }
#sqo-home .so-card__side{
  position: relative;
  padding: 3.48cqw 3.9cqw;
  min-height: 12.2cqw;
  display: flex; align-items: center; gap: 3.04cqw;
  color: #fff;
}
#sqo-home .so-card__side .so-card__check{ width: 6.09cqw; }
#sqo-home .so-card__side-label{ font-size: 4.13cqw; font-weight: 700; letter-spacing: -0.01em; line-height: 1.15; }
#sqo-home .so-card__cols{ display: grid; grid-template-columns: 1fr 1fr; gap: 2px; background: #D8DCE2; }
#sqo-home .so-card__col{ background: #F8F9FB; padding: 3.04cqw 2.6cqw 3.4cqw; }
#sqo-home .so-card__count{
  display: flex; align-items: center; justify-content: center;
  gap: 1.3cqw; margin-bottom: 2.6cqw;
  font-size: 2.83cqw; font-weight: 700;
}
#sqo-home .so-card__bubble{ width: 3.26cqw; height: auto; display: block; }
#sqo-home .so-card__comment{ display: grid; grid-template-columns: auto 1fr; gap: 1.74cqw; align-items: start; }
#sqo-home .so-card__c-avatar{
  width: 6.96cqw; height: 6.96cqw; border-radius: 50%;
  background: #C7CED6 center/cover; flex-shrink: 0; margin-top: 0.9cqw;
  overflow: hidden;
}
#sqo-home .so-card__c-avatar img{ width: 100%; height: 100%; object-fit: cover; }
#sqo-home .so-card__bubblecard{
  position: relative;
  background: #fff; border: 1px solid #E5E9EE; border-radius: 1.74cqw;
  padding: 2.17cqw 2.6cqw;
}
#sqo-home .so-card__tail{
  position: absolute; left: -1.3cqw; top: 2.6cqw;
  width: 2.6cqw; height: 2.6cqw; background: #fff;
  border-left: 1px solid #E5E9EE; border-bottom: 1px solid #E5E9EE;
  transform: rotate(45deg);
}
#sqo-home .so-card__c-head{ display: flex; align-items: flex-start; justify-content: space-between; gap: 1.74cqw; margin-bottom: 0.9cqw; }
#sqo-home .so-card__c-name{ font-size: 2.6cqw; font-weight: 800; letter-spacing: 0.01em; line-height: 1.2; }
#sqo-home .so-card__c-up{ display: inline-flex; align-items: flex-end; gap: 0.58cqw; flex-shrink: 0; font-size: 2.6cqw; font-weight: 700; color: #5A6470; line-height: 1; }
#sqo-home .so-card__c-upn{ position: relative; top: 0.2cqw; }
#sqo-home .so-card__c-up svg{ width: 2.6cqw; height: auto; display: block; position: relative; top: -0.2cqw; }
#sqo-home .so-card__c-text{ font-size: 3.04cqw; line-height: 1.22; font-weight: 500; color: #3a3a3a; }
#sqo-home .so-card__c-foot{ display: flex; align-items: center; justify-content: space-between; margin-top: 1.74cqw; }
#sqo-home .so-card__c-reply{ display: inline-flex; align-items: center; gap: 1.1cqw; font-size: 3.04cqw; font-weight: 700; line-height: 1; }
#sqo-home .so-card__c-reply svg{ width: 3.04cqw; height: 3.04cqw; display: block; }
#sqo-home .so-card__dots{ display: inline-flex; align-items: center; gap: 0.38cqw; }
#sqo-home .so-card__dots span{ width: 0.77cqw; height: 0.77cqw; border-radius: 50%; background: #B0B8C0; display: block; }
#sqo-home .so-card__foot{
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.96cqw 3.04cqw; background: #EBEDF0; border-top: 1px solid #DDE1E6;
  color: #9AA4AF; font-size: 2.6cqw; font-weight: 500;
}
#sqo-home .so-card__foot-brand{ display: inline-flex; align-items: center; gap: 1.5cqw; }
#sqo-home .so-card__diamond{ width: 3.4cqw; height: auto; display: block; }
#sqo-home .so-card__foot-right{ display: inline-flex; align-items: center; gap: 1.74cqw; }
#sqo-home .so-card__foot-links{ display: inline-flex; gap: 1.3cqw; align-items: center; }
#sqo-home .so-card__foot-links .sep{ opacity: 0.5; }
