/* PHP advisory: the URGENT header link on /security and the page at /security/php-update.
   Uses the page tokens from security.css; amber is reserved for the urgent signal. */
:root{--advisory-warn:oklch(80% .15 75)}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.advisory-dot{display:inline-block;flex:none;width:8px;height:8px;border-radius:50%;background:var(--advisory-warn);box-shadow:0 0 0 4px color-mix(in oklch,var(--advisory-warn) 22%,transparent)}

/* Header link */
.site-header nav>a.nav-urgent{display:flex;gap:10px;color:var(--advisory-warn);font-weight:700;letter-spacing:.14em}
.site-header nav>a.nav-urgent:hover{color:var(--color-ink)}
.site-header nav>a.nav-urgent[aria-current=page]{text-decoration:underline;text-underline-offset:6px}
@media(prefers-reduced-motion:no-preference){.nav-urgent .advisory-dot{animation:advisory-pulse 2.4s ease-in-out 3}}
@keyframes advisory-pulse{50%{box-shadow:0 0 0 7px color-mix(in oklch,var(--advisory-warn) 10%,transparent)}}

/* Page */
.advisory-page{display:grid;gap:clamp(48px,7vw,96px);padding-bottom:clamp(32px,5vw,64px)}
.advisory-closed{padding:14px 18px;border:1px solid var(--advisory-warn);border-radius:var(--radius-control);color:var(--color-ink)}
.advisory-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:22px;font-size:10px;font-weight:600;letter-spacing:.15em;line-height:1.5;color:var(--advisory-warn)}
.advisory-eyebrow-quiet{color:var(--color-muted)}
.advisory-hero{padding-top:clamp(24px,5vw,72px);border-top:2px solid var(--advisory-warn)}
.advisory-hero h1{font-size:clamp(42px,7vw,88px);max-width:14ch}
.advisory-lede{margin-top:24px;max-width:58ch;font-size:clamp(16px,1.4vw,19px);color:var(--color-muted)}
.advisory-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 28px;margin-top:34px}
.advisory-facts dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.advisory-facts dl>div{padding:18px 20px;background:var(--color-panel);border:1px solid var(--color-rule);border-radius:var(--radius-control);min-width:0}
.advisory-facts dt{margin-bottom:8px;font-size:10px;font-weight:600;letter-spacing:.15em;text-transform:uppercase;color:var(--color-muted)}
.advisory-facts dd{margin:0;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.5;overflow-wrap:anywhere}
.advisory-facts small{font-weight:400;font-size:12px;color:var(--color-muted)}
.advisory-facts .advisory-fact-warn{border-color:var(--advisory-warn)}
.advisory-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,6vw,96px)}
.advisory-split h2,.advisory-check h2,.advisory-faq h2{font-size:clamp(26px,3vw,38px);margin-bottom:20px}
.advisory-split p{color:var(--color-muted);max-width:58ch}
.advisory-split p+p{margin-top:14px}
.advisory-steps{margin:0;padding:0;list-style:none;counter-reset:step;display:grid;gap:16px}
.advisory-steps li{counter-increment:step;display:grid;grid-template-columns:32px minmax(0,1fr);gap:12px;color:var(--color-muted)}
.advisory-steps li::before{content:counter(step);display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--color-rule);border-radius:50%;font-size:12px;font-weight:650;color:var(--color-signal)}
.advisory-steps strong{color:var(--color-ink);font-weight:600}
.advisory-check{padding:clamp(28px,5vw,56px);background:var(--color-panel);border:1px solid var(--color-rule);border-radius:var(--radius-control)}
.advisory-check-steps{margin:8px 0 0;padding:0;list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.advisory-check-steps li{display:grid;align-content:start;gap:8px;padding-top:16px;border-top:2px solid var(--color-signal);min-width:0}
.advisory-check-steps b{font-weight:650}
.advisory-check-steps span{color:var(--color-muted);font-size:14px}
.advisory-note{margin-top:28px;font-size:13px;color:var(--color-muted)}
.advisory-faq{display:grid;gap:10px}
.advisory-faq>*{max-width:860px}
.advisory-faq details{border-bottom:1px solid var(--color-rule)}
.advisory-faq summary{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:56px;cursor:pointer;font-weight:600;list-style:none}
.advisory-faq summary::-webkit-details-marker{display:none}
.advisory-faq summary::after{content:"+";flex:none;font-size:20px;font-weight:400;color:var(--color-muted)}
.advisory-faq details[open] summary::after{content:"−"}
.advisory-faq details p{padding-bottom:18px;color:var(--color-muted);max-width:68ch}
.advisory-sources{font-size:12px;color:var(--color-muted)}
.advisory-sources a{text-decoration:underline;text-underline-offset:4px}

@media(max-width:1000px){
 .advisory-facts dl{grid-template-columns:repeat(2,minmax(0,1fr))}
 .advisory-check-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .site-header nav>a.nav-urgent{display:flex;letter-spacing:.1em}
 .advisory-split{grid-template-columns:1fr}
}
/* Very narrow phones: brand, URGENT and "Let's talk" share 288px, so spacing tightens and the arrow goes. */
@media(max-width:420px){
 .site-header{gap:12px}
 .site-header nav{gap:10px}
 .site-header nav>a.nav-urgent{letter-spacing:.04em;gap:8px}
 .site-header .nav-contact{padding:6px 10px}
 .site-header .nav-contact>span{display:none}
}
@media(max-width:520px){
 .advisory-facts dl,.advisory-check-steps{grid-template-columns:1fr}
 .advisory-actions .button{width:100%;white-space:normal}
}
@media(prefers-reduced-motion:reduce){.nav-urgent .advisory-dot{animation:none}}

/* Quick check: one address, observable results, optional consented follow-up. */
.advisory-hero h1{font-size:clamp(40px,6vw,76px);max-width:18ch}
.advisory-hero .advisory-lede{max-width:54ch;margin-top:18px}
.website-check-form{margin-top:28px;max-width:850px}
.website-check-form>label:first-child{display:block;font-weight:600;margin-bottom:9px}
.website-address-row{display:flex;gap:10px}
.website-address-row input{flex:1;min-width:0}
.website-check-form input:not([type=checkbox]),.website-lead-form input:not([type=checkbox]),.website-lead-form textarea{display:block;width:100%;min-height:54px;padding:14px 16px;color:var(--color-ink);background:var(--color-panel);border:1px solid var(--color-rule);border-radius:var(--radius-control);font:inherit}
.website-check-form input::placeholder,.website-lead-form input::placeholder{color:var(--color-muted)}
.website-check-form .button,.website-lead-form .button,.result-next .button{cursor:pointer;font:inherit;white-space:normal;border:1px solid var(--color-rule)}
.website-check-form .button:disabled,.website-lead-form .button:disabled{opacity:.6;cursor:wait}
.check-hint{font-size:13px;line-height:1.6;color:var(--color-muted);margin-top:10px}
.check-hint a,.check-consent a,.result-next a{text-decoration:underline;text-underline-offset:3px}
.check-consent{display:flex;align-items:flex-start;gap:12px;min-height:44px;margin-top:16px;max-width:75ch;font-size:14px;line-height:1.6;cursor:pointer}
.check-consent input{appearance:auto;flex:none;width:20px;height:20px;margin:2px 0;accent-color:var(--color-signal)}
.check-trap{display:none!important}
.check-status{margin-top:12px;font-size:14px;color:var(--color-signal);overflow-wrap:anywhere}
.check-status:empty{display:none}
.advisory-hero .advisory-actions{margin-top:22px;gap:12px 24px;font-size:14px}
.advisory-hero .advisory-actions .button{background:none;border:0;padding:0;min-height:44px;color:var(--color-muted);font-size:14px}
.website-result{scroll-margin-top:24px;max-width:1000px}
.website-result h2{font-size:clamp(26px,4vw,40px);max-width:32ch;overflow-wrap:anywhere}
.website-observations{margin:24px 0}
.website-observations>div{padding:20px 0;border-top:1px solid var(--color-rule);display:grid;grid-template-columns:1fr 1.4fr;gap:20px}
.website-observations dt{font-weight:600;font-size:17px}
.website-observations dd{margin:0;color:var(--color-muted);font-size:15px;max-width:65ch}
.result-next{margin-top:28px;padding:24px;background:var(--color-panel);border:1px solid var(--color-rule);border-radius:var(--radius-control)}
.result-next h3,.website-lead-form h3{font-size:26px;margin-bottom:14px}
.result-next>p:not(.advisory-eyebrow){max-width:65ch;color:var(--color-muted)}
.result-next .button{margin-top:20px}
.website-lead-form{margin-top:32px;max-width:760px}
.website-lead-form>p{color:var(--color-muted)}
.lead-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:24px}
.website-lead-form label:not(.check-consent){display:block;font-size:14px}
.website-lead-form input:not([type=checkbox]),.website-lead-form textarea{margin-top:6px;font-size:16px}
.website-lead-form>label{margin-top:18px}
.website-lead-form>.button{margin-top:24px}
.technical-details{border-block:1px solid var(--color-rule);padding:20px 0}
.technical-details>summary{cursor:pointer;font-size:20px;min-height:44px}
.technical-details>summary>span{display:block;font-size:13px;color:var(--color-muted)}
.technical-details .advisory-facts{margin-top:24px}
.technical-details .advisory-split{margin-block:32px 12px}
@media(prefers-reduced-motion:no-preference){
 .website-result:not([hidden]),.website-lead-form:not([hidden]){animation:check-appear .24s var(--ease-settle)}
 @keyframes check-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:600px){
 .advisory-hero{padding-top:24px}
 .advisory-eyebrow{font-size:10px;letter-spacing:.08em;margin-bottom:18px}
 .website-address-row{flex-direction:column}
 .website-address-row .button{width:100%;justify-content:center;gap:20px}
 .advisory-hero .advisory-actions{display:none}
 .website-observations>div{grid-template-columns:1fr;gap:6px;padding-block:18px}
 .lead-fields{grid-template-columns:1fr}
 .result-next{padding:20px}
 .result-next .button,.website-lead-form>.button{width:100%;gap:16px}
 .advisory-page{gap:40px}
}
/* Keep the essential action and service information visible. */
.patch-actions{display:grid;grid-template-columns:1.2fr 1fr;gap:48px}
.patch-actions h2{font-size:clamp(26px,3vw,38px);margin-bottom:24px}
.patch-actions h3{font-size:17px;margin-bottom:12px}
.patch-versions{font-size:clamp(24px,3vw,34px);font-weight:600;font-variant-numeric:tabular-nums;line-height:1.5}
.patch-details{margin-top:20px;color:var(--color-muted);font-size:13px}
.patch-details summary{min-height:44px;cursor:pointer;display:list-item;padding-block:12px}
.patch-details p{margin-block:10px}
.advisory-contact{display:flex;justify-content:space-between;align-items:center;gap:24px}
.advisory-contact h2{font-size:clamp(26px,3vw,38px)}
#host-question{user-select:text;font-size:15px;line-height:1.7}
#copy-host-question{background:transparent;color:var(--color-ink);margin-right:12px}
.whatsapp-float{position:fixed;z-index:20;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;width:56px;height:56px;padding:0;border-radius:50%;background:#25d366;color:#072b14;box-shadow:0 4px 24px #0006;font-size:15px;font-weight:650}
.whatsapp-float:hover{background:#46df80}
.whatsapp-float:focus-visible{outline:3px solid white;outline-offset:4px}
body:has(.whatsapp-float){padding-bottom:90px;scroll-padding-bottom:90px}
.advisory-page :is(input,textarea,button,a){scroll-margin-bottom:100px}
@media(max-width:600px){
 .patch-actions{grid-template-columns:1fr;gap:28px}
 .advisory-check{padding:24px}
 .advisory-check-steps{grid-template-columns:1fr 1fr;gap:16px}
 .advisory-check-steps li{font-size:15px}
 .advisory-contact{align-items:flex-start;flex-direction:column}
 .whatsapp-float{right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom))}
}

/* Center the campaign on every screen; keep entered details easy to read. */
.advisory-page{text-align:center}
.advisory-page .advisory-eyebrow{justify-content:center}
.advisory-hero h1,.advisory-hero .advisory-lede,.website-check-form,.website-result h2,.website-lead-form,.result-next>p{margin-inline:auto}
.website-check-form .check-consent{justify-content:center;margin-inline:auto;width:fit-content;text-align:left}
.website-address-row input,.website-lead-form label,.website-lead-form input,.website-lead-form textarea{text-align:left}
.website-observations dd{margin-inline:auto}
.patch-actions{grid-template-columns:1fr;max-width:850px;gap:32px}
.advisory-steps{max-width:560px;margin-inline:auto;text-align:left}
.patch-details{max-width:60ch;margin-inline:auto}
.advisory-contact{flex-direction:column;align-items:center;justify-content:center}
.advisory-check-steps li{text-align:center}
.advisory-page .button{justify-content:center}
.assessment-portal{max-width:850px;padding-block:40px 80px}
.assessment-portal h1{font-size:clamp(32px,5vw,54px)}
.assessment-portal h2,.assessment-portal h3{margin-top:28px}
.assessment-portal p,.assessment-portal dl{margin-block:18px;color:var(--color-muted)}
.assessment-portal dd{margin:8px 0 20px;overflow-wrap:anywhere;color:var(--color-ink)}
.assessment-portal .button{cursor:pointer;margin:8px 8px 8px 0;white-space:normal}
.assessment-portal pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit;line-height:1.7;padding:20px;background:var(--color-panel);border:1px solid var(--color-rule)}
.assessment-portal .button{border:1px solid var(--color-rule);background:transparent;color:var(--color-ink)}
.assessment-portal .button.primary{background:var(--color-ink);color:var(--color-button-ink)}

/* Indeterminate activity: no invented completion percentage. */
.check-progress{max-width:520px;height:6px;margin:24px auto 0;overflow:hidden;border-radius:8px;background:var(--color-rule)}
.check-progress span{display:block;height:100%;width:38%;border-radius:inherit;background:#e9ad42}
@media(prefers-reduced-motion:no-preference){
 .check-progress:not([hidden]) span{animation:php-check-loading 1.3s ease-in-out infinite alternate}
 @keyframes php-check-loading{from{transform:translateX(-100%)}to{transform:translateX(265%)}}
}
@media(prefers-reduced-motion:reduce){.check-progress span{width:100%}}
.php-observations{margin-top:24px;text-align:center}
.php-observations summary{cursor:pointer;padding:16px;min-height:44px;color:var(--color-muted)}
#php-verdict{font-size:clamp(25px,4vw,38px);line-height:1.2}
#result-heading:focus:not(:focus-visible){outline:none}
