@font-face { font-family: "Manrope"; src: url("fonts/manrope-variable.ttf") format("truetype"); font-weight: 200 800; font-display: swap; }
:root { --pf-blue:#0566f5; --pf-navy:#071d45; --pf-muted:#667085; --pf-line:#d9dee8; --pf-soft:#f5f8fc; }
* { box-sizing:border-box; }
body { margin:0; color:var(--pf-navy); background:#fff; font-family:"Manrope",sans-serif; }
a { color:inherit; }
button,select { font:inherit; }
.pf-catalog-app { min-height:100svh; }
.pf-site-header { position:sticky; z-index:50; top:var(--wp-admin--admin-bar--height,0); display:flex; align-items:center; justify-content:space-between; min-height:64px; padding:0 clamp(18px,5vw,88px); border-bottom:1px solid #edf0f4; background:rgba(255,255,255,.97); backdrop-filter:blur(14px); }
.pf-site-brand { font-size:20px; font-weight:800; letter-spacing:-.055em; text-decoration:none; }
.pf-site-brand span { color:var(--pf-blue); }
.pf-site-header nav { display:flex; gap:22px; font-size:13px; font-weight:650; }
.pf-site-header nav a { text-decoration:none; }
.pf-site-header nav a[aria-current] { color:var(--pf-blue); }
.pf-catalog-hero { width:100%; margin:0; padding:58px clamp(18px,5vw,88px) 38px; }
.pf-catalog-hero > p { margin:0 0 9px; color:var(--pf-blue); font-size:13px; font-weight:750; text-transform:uppercase; letter-spacing:.09em; }
.pf-catalog-hero h1 { max-width:720px; margin:0; font-size:clamp(38px,6vw,68px); line-height:1.02; letter-spacing:-.06em; }
.pf-catalog-hero > span { display:block; max-width:630px; margin:18px 0 25px; color:var(--pf-muted); line-height:1.55; }
.pf-catalog-hero > a,.pf-product-cta { display:inline-flex; align-items:center; min-height:48px; padding:0 18px; border-radius:8px; color:#fff; background:var(--pf-blue); font-weight:700; text-decoration:none; }
.pf-catalog-controls { position:sticky; z-index:40; top:64px; display:grid; grid-template-columns:repeat(6,minmax(130px,1fr)); gap:9px; width:100%; margin:0; padding:13px clamp(18px,5vw,88px); border-block:1px solid #edf0f4; background:rgba(255,255,255,.97); backdrop-filter:blur(14px); }
body.admin-bar .pf-catalog-controls { top:calc(64px + var(--wp-admin--admin-bar--height,0px)); }
.pf-catalog-controls label { display:grid; gap:4px; color:var(--pf-muted); font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; }
.pf-catalog-controls select { width:100%; height:40px; padding:0 9px; border:1px solid var(--pf-line); border-radius:7px; color:var(--pf-navy); background:#fff; font-size:12px; text-transform:none; }
.pf-catalog-count { width:100%; margin:25px 0 12px; padding:0 clamp(18px,5vw,88px); color:var(--pf-muted); font-size:13px; }
.pf-catalog-count strong { color:var(--pf-navy); }
.pf-catalog-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(270px,1fr)); gap:16px; width:100%; margin:0; padding:0 clamp(18px,5vw,88px) 90px; }
.pf-catalog-card { position:relative; display:flex; flex-direction:column; min-width:0; padding:16px; border:1px solid var(--pf-line); border-radius:12px; background:#fff; transition:transform .16s ease,box-shadow .16s ease; }
.pf-catalog-card:hover { transform:translateY(-2px); box-shadow:0 12px 30px rgba(7,29,69,.10); }
.pf-availability { align-self:flex-start; padding:5px 8px; border-radius:999px; color:#8c1d18; background:#fff0ef; font-size:9px; font-weight:700; }
.pf-availability.is-available { color:#176b43; background:#eaf8f1; }
.pf-catalog-image { display:grid; height:220px; place-items:center; }
.pf-catalog-image img { width:100%; height:100%; object-fit:contain; }
.pf-card-brand { margin:5px 0 2px; color:var(--pf-blue); font-size:11px; font-weight:700; }
.pf-catalog-card h2 { margin:0; font-size:20px; line-height:1.15; letter-spacing:-.04em; }
.pf-catalog-card h2 a { text-decoration:none; }
.pf-catalog-card > strong { margin:10px 0 14px; color:var(--pf-blue); font-size:22px; }
.pf-catalog-card dl { display:grid; grid-template-columns:repeat(3,1fr); margin:auto 0 15px; padding-top:13px; border-top:1px solid var(--pf-line); }
.pf-catalog-card dl div { padding:0 7px; border-right:1px solid var(--pf-line); }
.pf-catalog-card dl div:first-child { padding-left:0; }.pf-catalog-card dl div:last-child { border:0; }
.pf-catalog-card dt { color:var(--pf-muted); font-size:9px; }.pf-catalog-card dd { margin:4px 0 0; font-size:11px; font-weight:700; }
.pf-card-actions { display:grid; gap:9px; margin-top:auto; }
.pf-card-merchant { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:55px; padding:9px 13px; border-radius:8px; color:#fff; background:var(--pf-blue); font-size:12px; font-weight:750; line-height:1.2; text-decoration:none; }
.pf-card-merchant:hover { background:#0458d8; }
.pf-card-merchant span { min-width:0; }
.pf-card-merchant small { max-width:42%; color:#dce9ff; font-size:10px; font-weight:650; line-height:1.25; text-align:right; overflow-wrap:anywhere; }
.pf-card-secondary { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px; }
.pf-card-details { display:inline-flex; align-items:center; justify-content:center; gap:5px; min-height:38px; color:var(--pf-navy); font-size:12px; font-weight:700; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.pf-card-secondary button { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 12px; border:1px solid var(--pf-line); border-radius:7px; color:var(--pf-navy); background:#fff; cursor:pointer; font-size:12px; font-weight:700; }
.pf-card-secondary button:hover { border-color:var(--pf-blue); color:var(--pf-blue); }
.pf-card-secondary button[aria-pressed="true"] { border-color:var(--pf-navy); color:#fff; background:var(--pf-navy); }
.pf-compare-bar { position:fixed; z-index:70; right:0; bottom:0; left:0; display:flex; align-items:center; justify-content:center; gap:25px; min-height:66px; border-top:1px solid var(--pf-line); background:rgba(255,255,255,.97); box-shadow:0 -8px 24px rgba(7,29,69,.08); font-size:13px; }
.pf-compare-bar a { padding:10px 15px; border-radius:7px; color:#fff; background:var(--pf-blue); font-weight:700; text-decoration:none; }
.pf-compare-section { width:auto; margin:0 clamp(18px,5vw,88px) 100px; padding:28px; border-radius:16px; background:var(--pf-soft); scroll-margin-top:145px; }
.pf-section-heading { display:flex; align-items:start; justify-content:space-between; gap:20px; }.pf-section-heading p{margin:0;color:var(--pf-blue);font-size:11px;font-weight:700}.pf-section-heading h2{margin:4px 0 22px;font-size:26px}.pf-section-heading button{border:0;background:transparent;color:var(--pf-blue);cursor:pointer;font-weight:700}
.pf-compare-grid { display:grid; grid-template-columns:1fr 1fr 1fr; overflow:hidden; border:1px solid var(--pf-line); border-radius:10px; background:#fff; }
.pf-compare-grid > * { min-width:0; padding:13px; border-bottom:1px solid var(--pf-line); }.pf-compare-grid > strong{font-size:13px}.pf-compare-grid > span{color:var(--pf-muted);font-size:11px}.pf-compare-grid > b{font-size:12px}
.pf-product-page { width:100%; margin:0; padding:35px clamp(18px,5vw,88px) 80px; }.pf-back-catalog{color:var(--pf-blue);font-size:12px;font-weight:700;text-decoration:none}
.pf-product-hero { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:55px; margin-top:30px; }.pf-product-visual{display:grid;min-height:460px;place-items:center;border-radius:18px;background:var(--pf-soft)}.pf-product-visual img{width:90%;height:420px;object-fit:contain}.pf-product-copy>p:first-child{margin:0;color:var(--pf-blue);font-weight:700}.pf-product-copy h1{margin:5px 0 12px;font-size:clamp(40px,6vw,68px);line-height:1;letter-spacing:-.06em}.pf-product-copy>strong{display:block;margin:18px 0;color:var(--pf-blue);font-size:30px}.pf-product-copy>p:not(:first-child){color:var(--pf-muted);line-height:1.55}.pf-product-specs{margin-top:48px}.pf-product-specs h2{font-size:28px}.pf-product-specs dl{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--pf-line);border-radius:12px}.pf-product-specs dl div{padding:20px;border-right:1px solid var(--pf-line);border-bottom:1px solid var(--pf-line)}.pf-product-specs dt{color:var(--pf-muted);font-size:11px}.pf-product-specs dd{margin:5px 0 0;font-size:18px;font-weight:750}.pf-official-link{display:inline-flex;margin-top:22px;color:var(--pf-blue);font-weight:700}.pf-catalog-loading,.pf-catalog-error,.pf-catalog-empty{padding:70px 18px;text-align:center}
.pf-product-guide{max-width:900px;margin:48px auto 0;padding-top:42px;border-top:1px solid var(--pf-line)}.pf-product-guide h2{margin:0 0 13px;font-size:26px;line-height:1.2}.pf-product-guide h2:not(:first-child){margin-top:36px}.pf-product-guide p,.pf-product-guide li{color:#465267;line-height:1.7;font-size:15px}.pf-product-guide ul{padding-left:22px}.pf-product-guide li+li{margin-top:9px}.pf-product-alternatives{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.pf-product-alternatives a{display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--pf-line);border-radius:10px;color:var(--pf-navy);text-decoration:none}.pf-product-alternatives a:hover{border-color:var(--pf-blue)}.pf-product-alternatives span{color:var(--pf-blue);font-size:10px;font-weight:750}.pf-product-alternatives b{font-size:15px}.pf-product-alternatives small{color:var(--pf-muted);font-size:11px}.pf-editorial-meta{margin-top:28px!important;font-size:12px!important;color:var(--pf-muted)!important}
@media(max-width:800px){.pf-site-header nav{gap:12px;font-size:11px}.pf-catalog-hero{padding-top:38px}.pf-catalog-controls{top:64px;display:flex;overflow-x:auto;padding-block:10px}.pf-catalog-controls label{flex:0 0 145px}.pf-catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.pf-catalog-card{padding:11px}.pf-catalog-image{height:150px}.pf-catalog-card h2{font-size:16px}.pf-catalog-card dl{grid-template-columns:1fr}.pf-catalog-card dl div{display:flex;justify-content:space-between;padding:5px 0;border:0}.pf-catalog-card dd{margin:0}.pf-card-actions{grid-template-columns:1fr}.pf-product-hero{grid-template-columns:1fr;gap:25px}.pf-product-visual{min-height:310px}.pf-product-visual img{height:290px}.pf-product-specs dl{grid-template-columns:repeat(2,1fr)}.pf-product-alternatives{grid-template-columns:1fr}}
@media(max-width:380px){.pf-catalog-grid{grid-template-columns:1fr}.pf-catalog-image{height:210px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition-duration:.01ms!important}}

.pf-catalog-note { margin: -58px clamp(18px,5vw,88px) 64px; max-width: 780px; color: var(--pf-muted); font-size: 13px; line-height: 1.6; }
.pf-product-specs dl p { font-weight: 400; margin: 9px 0 0; color: var(--pf-muted); font-size: 13px; line-height: 1.5; }
.pf-compare-grid > a { display: flex; align-items: center; min-height: 44px; color: var(--pf-blue); font-size: 12px; font-weight: 700; text-underline-offset: 3px; overflow-wrap: anywhere; }
.pf-product-specs h2, .pf-section-heading h2 { line-height: 1.2; }
.pf-site-header { gap: 14px; }
.pf-site-brand { white-space: nowrap; }
@media(max-width:800px) { .pf-product-specs dl div { padding: 16px; } .pf-product-specs dl p { font-size: 12px; } .pf-catalog-controls label:last-child { flex-basis: 215px; } }

/* Friendly visual cues for product specifications. */
.pf-product-specs dl>div{display:grid;grid-template-columns:38px minmax(0,1fr);column-gap:13px;align-items:start}
.pf-product-specs dl>div>.pf-spec-icon{grid-column:1;grid-row:1 / span 2}
.pf-product-specs dl>div>dt,.pf-product-specs dl>div>dd{grid-column:2}
.pf-spec-icon{width:38px;height:38px;flex:0 0 auto;padding:8px;border-radius:11px;background:#e7f0ff}
