/* BlueArc Cert public site.
   Structure and type system follow aussiewrn.com.au: Georgia display, system sans body,
   paper ground, one dark hero, hairline sections. Palette is the product's own indigo with
   the same moss accent aussiewrn uses for "covered". Change the tokens below to retheme.
   CSP is script-src 'self' and style-src 'self', so no inline styles and no web fonts. */
:root{
  --g900:#14133C; --g800:#1C1B52; --g700:#272577; --g600:#312F8C; --g500:#5D5BA8;
  --moss:#A3C182; --moss2:#C6D9B4; --moss3:#E4EEDA; --mossd:#4B6B2E;
  --paper:#F8FAF8; --paper2:#EFF1F4; --paper3:#E3E6EB;
  --ink:#14122E; --body:#26234A; --muted:#55527A;
  --ondark:#F6F8F4; --ondarkm:#CDCBE6; --ondarkf:#B3B0D6;
  --line:#DEDFE8; --linedk:rgba(255,255,255,.16); --focus:#A3C182;
  --serif:Georgia,"Iowan Old Style","Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --t-display:clamp(2.4rem,1.4rem + 3.2vw,3.9rem);
  --t-h2:clamp(1.85rem,1.25rem + 2vw,2.8rem);
  --t-h3:1.1875rem; --t-lede:clamp(1.125rem,1.02rem + .42vw,1.35rem);
  --t-b:1.0625rem; --t-s:.9375rem; --t-l:.8125rem;
  --gut:24px; --maxw:1180px; --sec:clamp(64px,5.5vw,112px); --r:10px;
  --sh1:0 1px 2px rgba(20,18,46,.05),0 8px 20px -12px rgba(20,18,46,.28);
  --sh2:0 2px 4px rgba(20,18,46,.06),0 28px 56px -26px rgba(20,18,46,.42);
  --sh3:0 3px 6px rgba(0,0,0,.16),0 44px 90px -34px rgba(0,0,0,.62);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{background:var(--paper);color:var(--body);font:var(--t-b)/1.66 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{font-family:var(--serif);color:var(--ink);font-weight:700;line-height:1.08;letter-spacing:-.026em;text-wrap:balance}
h1{font-size:var(--t-display)} h2{font-size:var(--t-h2);letter-spacing:-.024em}
h3{font-size:var(--t-h3);letter-spacing:-.008em;line-height:1.3}
p{text-wrap:pretty} a{color:var(--g600)} img,video{max-width:100%;display:block}
strong,b{font-weight:700;color:var(--ink)}
.dark strong,.dark b{color:inherit}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gut)}
.skip{position:absolute;left:-9999px;top:0;background:var(--g600);color:#fff;padding:12px 18px;z-index:99}
.skip:focus{left:0}
:where(a,button,summary):focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.eyebrow{display:flex;align-items:center;gap:12px;font-size:var(--t-l);font-weight:700;letter-spacing:.17em;text-transform:uppercase;color:var(--g500)}
.eyebrow::before{content:"";width:26px;height:2px;background:currentColor;flex:none;opacity:.85}
.lede{font-size:var(--t-lede);line-height:1.5;color:var(--body)}
.fine{font-size:var(--t-s);color:var(--muted);line-height:1.58}

/* header */
header.site{position:sticky;top:0;z-index:40;background:rgba(248,250,248,.88);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid var(--line)}
header.site .wrap{display:flex;align-items:center;gap:16px;height:76px}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;white-space:nowrap;color:var(--ink);font-family:var(--serif);font-weight:700;font-size:1.125rem;letter-spacing:-.01em}
.brand svg{flex:none}
nav.main{margin-left:auto;display:flex;align-items:center;gap:24px}
nav.main a{color:var(--body);text-decoration:none;font-size:var(--t-s);white-space:nowrap;position:relative}
nav.main a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1.5px;background:var(--g600);transform:scaleX(0);transform-origin:left;transition:transform .22s ease}
nav.main a:not(.btn):hover::after{transform:scaleX(1)}
nav.main a:hover{color:var(--ink)} nav.main a.signin{font-weight:600;color:var(--ink)}
.menu{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:8px;width:44px;height:44px;cursor:pointer;color:var(--ink)}
.menu svg{margin:auto}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;background:var(--g600);color:#fff;text-decoration:none;font-weight:600;font-size:var(--t-s);border:1px solid var(--g600);border-radius:var(--r);padding:12px 20px;min-height:44px;white-space:nowrap;box-shadow:var(--sh1);transition:transform .16s ease,box-shadow .16s ease,background .16s ease;cursor:pointer;font-family:inherit}
.btn:hover{background:var(--g700);border-color:var(--g700);transform:translateY(-1px);box-shadow:var(--sh2)}
nav.main a.btn,nav.main a.btn:hover{color:#fff} nav.main a.btn::after{display:none}
.btn.lg{padding:16px 26px;font-size:var(--t-b);border-radius:12px}
.btn.ghost{background:transparent;color:var(--ink);border-color:var(--line);box-shadow:none}
.btn.ghost:hover{background:var(--paper2);border-color:var(--muted)}
.btn.ondark{background:var(--moss);color:var(--g900);border-color:var(--moss)}
.btn.ondark:hover{background:var(--moss2);border-color:var(--moss2)}
.dark .btn.ghost{background:transparent;color:var(--ondark);border-color:rgba(255,255,255,.32)}
.dark .btn.ghost:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.55)}
.btn .arw{width:15px;height:11px;flex:none}

/* dark ground */
.dark{position:relative;background:var(--g700);color:var(--ondarkm);isolation:isolate}
.dark h1,.dark h2,.dark h3{color:var(--ondark)} .dark p,.dark .lede{color:var(--ondarkm)}
.dark .eyebrow{color:var(--moss)} .dark a{color:#fff}
.dark a.btn.ondark{color:var(--g900)}

section{padding:var(--sec) 0}
.band{background:var(--paper2);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.head{max-width:62ch} .head h2{margin-top:16px} .head .lede{margin-top:16px}

/* hero */
.hero{padding:clamp(48px,6vw,96px) 0 clamp(56px,6vw,104px);background:linear-gradient(180deg,var(--g800) 0%,var(--g700) 100%)}
.hero .grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:clamp(32px,5vw,72px);align-items:center}
.hero h1{margin-top:20px} .hero .lede{margin-top:22px;max-width:52ch}
.cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.chips{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:12px 32px;margin-top:34px;padding-top:26px;border-top:1px solid var(--linedk)}
.chips div{font-size:var(--t-s);color:var(--ondarkm);line-height:1.35}
.chips b{display:block;font-family:var(--serif);font-size:1.5rem;color:var(--moss);letter-spacing:-.02em;line-height:1.15}
.stds{margin-top:18px;font-size:var(--t-l);letter-spacing:.06em;color:var(--ondarkf)}
.hero .guide{display:inline-block;margin-top:18px;font-size:var(--t-s)}

/* browser frame */
.frame{background:#fff;border-radius:12px;box-shadow:var(--sh3);overflow:hidden;border:1px solid rgba(255,255,255,.14)}
.band .frame,.plain .frame,section:not(.dark) .frame{border-color:var(--line);box-shadow:var(--sh2)}
.frame .bar{display:flex;align-items:center;gap:6px;padding:9px 12px;background:#F1F2F6;border-bottom:1px solid var(--line)}
.frame .bar i{width:9px;height:9px;border-radius:50%;background:#C9CBD6;display:block}
.frame .bar span{margin-left:10px;flex:1;max-width:240px;background:#fff;border-radius:6px;font-size:11px;color:var(--muted);padding:3px 10px;border:1px solid var(--line)}
.frame img{width:100%;height:auto}
.shotwrap{position:relative}
.tag{position:absolute;top:-16px;left:24px;z-index:2;background:var(--g800);color:#fff;font-weight:700;font-size:var(--t-s);padding:9px 16px;border-radius:10px;box-shadow:var(--sh2);border:1px solid rgba(255,255,255,.18)}
.tag em{font-style:normal;color:var(--moss)}
.sample{font-size:var(--t-l);color:var(--muted);margin-top:10px}
.dark .sample{color:var(--ondarkf)}

/* problem */
.five{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:44px;border-top:1px solid var(--line)}
.five div{padding:26px 22px 8px 0;border-right:1px solid var(--line);margin-right:22px}
.five div:last-child{border-right:0;margin-right:0}
.five b{display:block;font-family:var(--serif);font-size:1.2rem;line-height:1.25;margin-bottom:8px;letter-spacing:-.01em}
.five p{font-size:var(--t-s);color:var(--muted);line-height:1.55}

/* standards */
.stdtable{margin-top:40px;width:100%;border-collapse:collapse}
.stdtable th{font-size:var(--t-l);text-transform:uppercase;letter-spacing:.14em;color:var(--muted);text-align:left;padding:0 12px 12px 0;border-bottom:2px solid var(--ink)}
.stdtable td{padding:18px 12px 18px 0;border-bottom:1px solid var(--line);font-size:var(--t-b)}
.stdtable td:first-child{font-family:var(--serif);font-weight:700;font-size:1.25rem;color:var(--ink)}
.stdtable td.n{font-family:var(--serif);font-size:1.5rem;font-weight:700;color:var(--g600);text-align:right;padding-right:0}
.stdtable th.n{text-align:right;padding-right:0}
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(32px,6vw,88px);align-items:start}

/* steps */
.steps{margin-top:56px}
.step{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,72px);align-items:center;padding:clamp(36px,4vw,64px) 0;border-top:1px solid var(--line)}
.step:first-child{border-top:0;padding-top:0}
.step.flip .txt{order:2}
.step .n{font-family:var(--serif);font-size:var(--t-l);letter-spacing:.17em;text-transform:uppercase;font-weight:700;color:var(--g500);font-family:var(--sans)}
.step h3{font-size:clamp(1.55rem,1.2rem + 1.2vw,2.1rem);line-height:1.12;margin:10px 0 14px;letter-spacing:-.02em}
.step ul{list-style:none;margin:16px 0 0}
.step li{position:relative;padding:7px 0 7px 28px;font-size:var(--t-b)}
.step li::before{content:"";position:absolute;left:0;top:14px;width:16px;height:16px;border-radius:50%;background:var(--moss3);border:1px solid var(--moss)}
.step li::after{content:"";position:absolute;left:5px;top:19px;width:5px;height:8px;border:solid var(--mossd);border-width:0 2px 2px 0;transform:rotate(40deg) scale(.9)}
.benefit{margin-top:18px;font-size:var(--t-s);color:var(--muted);padding-left:14px;border-left:2px solid var(--moss)}
.benefit b{color:var(--ink)}
.step .phones{max-width:460px;margin:0 auto}

/* video */
.video{margin-top:40px;border-radius:14px;overflow:hidden;box-shadow:var(--sh2);border:1px solid var(--line);background:var(--g900)}
.video video{width:100%;height:auto;aspect-ratio:16/9;background:var(--g900)}

/* security */
.sec{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.sec div{padding:26px 24px 28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.sec svg{width:26px;height:26px;color:var(--g600);margin-bottom:14px}
.sec b{display:block;font-family:var(--serif);font-size:1.12rem;line-height:1.25;margin-bottom:6px;letter-spacing:-.01em}
.sec p{font-size:var(--t-s);color:var(--muted);line-height:1.55}
.roles{display:flex;flex-wrap:wrap;gap:10px;margin-top:36px}
.roles span{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 16px;font-size:var(--t-s)}
.roles b{margin-right:6px}

/* pricing */
.price{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(28px,5vw,72px);align-items:center}
.card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:clamp(28px,3.4vw,44px);box-shadow:var(--sh2)}
.card .amt{font-family:var(--serif);font-size:clamp(3rem,2rem + 3vw,4.4rem);font-weight:700;color:var(--ink);letter-spacing:-.04em;line-height:1}
.card .amt small{font-family:var(--sans);font-size:var(--t-b);font-weight:500;color:var(--muted);letter-spacing:0;margin-left:6px}
.card .per{margin-top:10px;color:var(--body)}
.card ul{list-style:none;margin:22px 0 26px;padding-top:20px;border-top:1px solid var(--line)}
.card li{padding:6px 0 6px 28px;position:relative;font-size:var(--t-b)}
.card li::before{content:"";position:absolute;left:0;top:13px;width:16px;height:16px;border-radius:50%;background:var(--moss3);border:1px solid var(--moss)}
.card li::after{content:"";position:absolute;left:5px;top:17px;width:5px;height:8px;border:solid var(--mossd);border-width:0 2px 2px 0;transform:rotate(40deg) scale(.9)}
.card .btn{width:100%}
.card .fine{margin-top:14px}

/* faq */
.faq{max-width:820px;margin-top:40px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;padding:22px 40px 22px 0;font-family:var(--serif);font-weight:700;font-size:1.2rem;color:var(--ink);position:relative;letter-spacing:-.01em;line-height:1.3}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:6px;top:50%;transform:translateY(-52%);font-family:var(--sans);font-weight:400;font-size:1.7rem;color:var(--g500)}
.faq details[open] summary::after{content:"\2212"}
.faq details p{padding:0 40px 24px 0;color:var(--body)}

/* closing + footer */
.closing{text-align:center;padding:clamp(72px,7vw,120px) 0}
.closing h2{max-width:20ch;margin:0 auto} .closing .lede{max-width:50ch;margin:18px auto 0}
.closing .cta{justify-content:center}
footer.site{background:var(--g900);color:var(--ondarkf);padding:56px 0 36px;font-size:var(--t-s)}
footer.site .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:32px}
footer.site h4{font-family:var(--sans);font-size:var(--t-l);letter-spacing:.14em;text-transform:uppercase;color:var(--ondark);margin-bottom:14px;font-weight:700}
footer.site a{display:block;color:var(--ondarkm);text-decoration:none;padding:4px 0} footer.site a:hover{color:#fff;text-decoration:underline}
footer.site a.brand{display:flex;color:#fff;margin-bottom:12px;padding:0} footer.site p{color:var(--ondarkf);max-width:34ch;line-height:1.55}
footer.site .legal{margin-top:40px;padding-top:22px;border-top:1px solid var(--linedk);display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;font-size:var(--t-l)}

/* simple pages */
.page{padding:clamp(48px,6vw,88px) 0 clamp(64px,7vw,110px)}
.page .wrap{max-width:820px}
.page h1{font-size:clamp(2.1rem,1.4rem + 2.4vw,3.2rem);margin:16px 0 22px}
.page h2{font-size:1.5rem;margin:40px 0 10px} .page p,.page li{margin-bottom:12px} .page ul{padding-left:22px}
.notice{background:var(--moss3);border:1px solid var(--moss);border-radius:10px;padding:14px 18px;font-size:var(--t-s);margin:22px 0}
.next{list-style:none;padding:0;counter-reset:n;margin:28px 0}
.next li{counter-increment:n;position:relative;padding:18px 0 18px 64px;border-top:1px solid var(--line)}
.next li:last-child{border-bottom:1px solid var(--line)}
.next li::before{content:counter(n);position:absolute;left:0;top:14px;width:42px;height:42px;border-radius:50%;background:var(--g700);color:#fff;font-family:var(--serif);font-weight:700;font-size:1.2rem;display:flex;align-items:center;justify-content:center}
.next b{display:block;font-family:var(--serif);font-size:1.2rem;margin-bottom:2px}

@media (max-width:980px){
  .hero .grid,.split,.step,.price{grid-template-columns:1fr}
  .step.flip .txt{order:0}
  .five{grid-template-columns:1fr 1fr}.five div{border-right:0;margin-right:0;border-bottom:1px solid var(--line);padding:22px 16px 18px 0}
  .sec{grid-template-columns:1fr 1fr}
  footer.site .cols{grid-template-columns:1fr 1fr}
  nav.main{display:none;position:absolute;top:76px;left:0;right:0;background:var(--paper);flex-direction:column;align-items:stretch;gap:0;padding:8px var(--gut) 20px;border-bottom:1px solid var(--line);box-shadow:var(--sh2)}
  nav.main.open{display:flex} nav.main a{padding:14px 0;border-bottom:1px solid var(--line)} nav.main a.btn{margin-top:14px;border-bottom:1px solid var(--g600)}
  .menu{display:flex}
}
@media (max-width:620px){
  :root{--gut:20px}
  .five,.sec,footer.site .cols{grid-template-columns:1fr}
  .tag{left:12px;font-size:var(--t-l)}
  .cta .btn{width:100%} .btn{white-space:normal;text-align:center}
  .stdtable td:first-child{font-size:1.05rem}.stdtable td.n{font-size:1.25rem}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

.lede+.lede,.lede+.fine,.fine+.fine{margin-top:16px}
.split h2{margin-top:16px}.split .eyebrow+h2{margin-top:16px}
.faqgrid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(28px,6vw,88px);align-items:start}
.faqgrid .faq{max-width:none;margin-top:0}
@media (max-width:980px){.faqgrid{grid-template-columns:1fr}.chips{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.chips{grid-template-columns:1fr}}
.split h2+.lede,.price h2+.lede,.faqgrid h2+.lede{margin-top:16px}
