/* Industry pages, shared (2026-10-03). Loaded by all seven industry pages after v3.css and before the page's own
   stylesheet. One type scale and one palette, both taken from the homepage, so the seven pages read as one site while
   each keeps its own layout and animation. Page stylesheets use these tokens instead of their own sizes and colours. */

:root{
  /* type: the homepage scale. h2 and .lede come straight from v3.css */
  --i-h1:clamp(2.2rem,3.7vw,3.3rem);          /* hero headline: the homepage's 35px on phones, a notch under its 59px on desktop because these run longer */
  --i-t1:clamp(1.25rem,1.7vw,1.5rem);         /* feature titles: the two service names, large photo tiles, big stacked cards (homepage capability cards, 24px) */
  --i-t2:clamp(1.05rem,1.25vw,1.1rem);        /* card titles: problem cards, service items, reasons, questions (homepage privacy titles, 17.6px) */
  --i-body:.92rem;                            /* card and answer text (homepage privacy text, 14.7px) */
  --i-li:.9rem;                               /* checklist items */
  --i-copy:1rem;                              /* long paragraphs such as the closing copy */
  /* text colours: titles in ink, the hero headline in deep forest, body in muted grey, lists in ink2 */
  --i-h1c:#0E3A1F; --i-title:var(--ink); --i-text:var(--muted); --i-list:var(--ink2);
  --i-title-on:#fff; --i-text-on:rgba(255,255,255,.84); --i-list-on:rgba(255,255,255,.9);
  /* palette: homepage values only */
  --i-deep:#0E3A1F; --i-forest:#173D29; --i-forest2:#1F4A31; --i-mid:#3F5C3B; --i-lime:#C6E57C; --i-lime2:#ABD963; --i-limesoft:#EEF5DF; --i-limesoft2:#E2EFC8;
  --i-teal:#16485A; --i-teal2:#1E6577; --i-teal3:#2A7891; --i-tealsoft:#DDEFF0; --i-teallight:#A6D6D8;
  --i-flat:#EDF4E0;                                                                                     /* calculator section */
  /* the homepage's gradients, the only ones these pages use */
  --g-band:linear-gradient(212deg,#E2F0C2 0%,#EEF4D2 28%,#DDEFE6 60%,#C6E5E3 100%);                    /* "How SEKHN works": lime > yellow > teal */
  --g-cream:linear-gradient(212deg,#E2F0C2 0%,#EDF5D6 30%,#F4F9E8 65%,#F7FAEF 100%);                   /* tinted section */
  --g-dark:radial-gradient(90% 60% at 100% 0%,#2F6B47 0%,rgba(47,107,71,0) 70%),radial-gradient(85% 60% at 0% 100%,#0F4A57 0%,rgba(15,74,87,0) 72%),#173D29; /* calculator result panel */
  --g-lime:linear-gradient(212deg,#A2D458 0%,#BFE277 30%,#E3EEA6 70%,#F3F5D2 100%);                    /* Strategy tile */
  --g-forest:radial-gradient(90% 70% at 85% 0%,#2E6A45 0%,rgba(46,106,69,0) 70%),#1F4A31;               /* Build tile */
  --g-teal:radial-gradient(80% 60% at 78% 12%,#6BB8CC 0%,rgba(107,184,204,0) 65%),radial-gradient(80% 70% at 15% 95%,#0E3C4C 0%,rgba(14,60,76,0) 70%),#2A7891; /* Deploy tile */
  /* photo scrims: forest (capabilities band) and teal (clients panel) */
  --s-forest:9,30,17; --s-teal:5,32,42;
}

/* hero headline, one size on every industry page */
.ind .hero h1{font-size:var(--i-h1);line-height:1.06;letter-spacing:-.045em}

/* ---- Frequently asked questions: heading on the left, a glass accordion on the right (the About page pattern) ---- */
.iq-grain{position:relative;isolation:isolate}
.iq-grain::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.3;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E") 0 0/180px 180px}
section.iq-faq{background:var(--g-cream)}
.iq-split{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(2rem,5vw,4.5rem);align-items:start}
.iq-head{position:sticky;top:calc(64px + 2rem);display:grid;gap:1rem}
.iq-head h2{max-width:12ch}
.iq-acc{border-radius:26px;padding:.4rem clamp(1.1rem,2.2vw,1.8rem);
  background:rgba(255,255,255,.74);border:1px solid rgba(255,255,255,.92);backdrop-filter:blur(18px) saturate(1.3);-webkit-backdrop-filter:blur(18px) saturate(1.3);box-shadow:0 18px 44px rgba(34,53,42,.09),inset 0 1px 0 #fff}
.iq-qa+.iq-qa{border-top:1px solid rgba(34,53,42,.09)}
.iq-qa h3{margin:0;font-size:inherit;letter-spacing:inherit}
.iq-q{appearance:none;-webkit-appearance:none;border:0;background:none;margin:0;width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.1rem 0;text-align:left;cursor:pointer;
  font:600 var(--i-t2)/1.3 var(--display);letter-spacing:-.02em;color:var(--i-title);-webkit-tap-highlight-color:transparent}
.iq-plus{width:32px;height:32px;padding:8px;border-radius:50%;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;color:var(--i-mid);background:var(--i-limesoft);transition:transform .45s var(--ease),background .3s,color .3s}
.iq-q:hover .iq-plus{background:var(--i-limesoft2)}
.iq-q[aria-expanded="true"] .iq-plus{transform:rotate(45deg);background:var(--i-forest2);color:var(--i-lime)}
/* the open answer eases to its height (grid rows 0fr to 1fr); closed answers leave the accessibility tree */
.iq-a{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .5s var(--ease),visibility 0s linear .5s}
.iq-qa.open .iq-a{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .5s var(--ease),visibility 0s}
html:not(.js) .iq-a{grid-template-rows:1fr;visibility:visible}
.iq-a>div{min-height:0;overflow:hidden}
.iq-a p{padding:0 3rem 1.2rem 0;font-size:var(--i-body);line-height:1.65;color:var(--i-text)}
@media (max-width:860px){
  .iq-split{grid-template-columns:1fr;gap:1.5rem}
  .iq-head{position:static}
  .iq-head h2{max-width:none}
  .iq-a p{padding-right:.5rem}
}
@media (prefers-reduced-motion:reduce){.iq-a,.iq-qa.open .iq-a,.iq-plus{transition:none}}