/* WooCommerce Product Configurator Development page — built on the site template tokens */
.hero2{position:relative;overflow:hidden;color:#cfd8ee;padding:3rem 0 4.2rem;background:radial-gradient(800px 380px at 88% -8%,#27407a 0%,transparent 62%),radial-gradient(560px 280px at -4% 112%,#12475a66 0%,transparent 62%),var(--ink)}
.hero2:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#ffffff09 1px,transparent 1px),linear-gradient(90deg,#ffffff09 1px,transparent 1px);background-size:44px 44px;-webkit-mask-image:linear-gradient(180deg,#000,transparent 88%);mask-image:linear-gradient(180deg,#000,transparent 88%);pointer-events:none}
.hero2 .wrap{position:relative}
.hero2 h1{color:#fff;margin:.35em 0 .4em}.hero2 h1 em{font-style:normal;color:var(--gold)}
.eyebrow{display:inline-flex;align-items:center;gap:.55rem;font:500 .8rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.09em;text-transform:uppercase;color:#6fd6c9}
.eyebrow:before{content:"";width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 4px #19a89a33}
.facts{list-style:none;padding:0;margin:2rem 0 0;display:grid;gap:.9rem;grid-template-columns:repeat(3,auto);justify-content:start}
.facts li{border-left:3px solid var(--gold);padding-left:.8rem;line-height:1.25}
.facts b{display:block;color:#fff;font:700 1rem Sora,sans-serif}.facts span{font-size:.9rem;color:#9fb0d6}
.winbar{display:flex;align-items:center;gap:.4rem;padding:.7rem 1rem;background:#0e1830;border-bottom:1px solid #2a3a60;color:#7f8fb3}
.winbar i{width:10px;height:10px;border-radius:50%;background:#2a3a60}.winbar i:first-child{background:#f5b041}.winbar span{margin-left:.6rem;font-size:.8rem}
.hero2 .code pre{min-height:0}
/* overview cards */
.sec .lead2{font-size:1.2rem;max-width:62ch;color:var(--text)}
.card.static{cursor:default}.card.static:hover{transform:none;box-shadow:none;border-color:var(--line)}
.card.static h3{margin-bottom:.4em}.card.static p{margin:0}
/* sample showcase */
.showcase{position:relative;overflow:hidden;color:#cfd8ee;padding:4.5rem 0 5rem;background:radial-gradient(700px 320px at 12% 0%,#f5b0411f 0%,transparent 65%),linear-gradient(180deg,var(--ink),#0b1326)}
.showcase .wrap{position:relative}
.badge{display:inline-block;background:#f5b04126;color:var(--gold);border:1px solid #f5b04155;font:500 .78rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.09em;text-transform:uppercase;padding:.3rem .8rem;border-radius:99px}
.showcase h2{color:#fff;margin:.7rem 0 .5rem}
.sh-head{display:grid;gap:1.4rem;align-items:end;margin-bottom:2.2rem}
.sh-head p{margin:0;max-width:60ch}
.sh-head .pills{margin:0}
.frame{border-radius:18px;background:var(--paper);box-shadow:0 50px 90px -40px #000c,0 0 0 1px #ffffff1c;overflow:hidden}
.frame-bar{display:flex;align-items:center;gap:.45rem;padding:.75rem 1rem;background:#e3e9f5;border-bottom:1px solid var(--line)}
.frame-bar i{width:11px;height:11px;border-radius:50%;background:#c3cde0}.frame-bar i:first-child{background:#ef8a80}.frame-bar i:nth-child(2){background:#f5c96b}.frame-bar i:nth-child(3){background:#7fd1a0}
.frame-bar .url{flex:1;margin:0 .8rem;background:#fff;border-radius:99px;padding:.25rem 1rem;font:400 .8rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.frame-bar .tag{font:500 .72rem ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--teal);text-transform:uppercase;letter-spacing:.08em}
.sh-foot{margin:1.4rem 0 0;color:#9fb0d6;font-size:.95rem;text-align:center}
@media(min-width:900px){.sh-head{grid-template-columns:1.1fr .9fr}}
@media(max-width:640px){.facts{grid-template-columns:1fr}.frame-bar .tag{display:none}}

/* ===== Right-to-left (Arabic) ===== */
html[dir=rtl] .facts li{border-left:0;border-right:3px solid var(--gold);padding-left:0;padding-right:.8rem}
html[dir=rtl] .winbar span{margin-left:0;margin-right:.6rem}
html[dir=rtl] .hero2 .code,html[dir=rtl] .hero2 .code pre{direction:ltr;text-align:left}
html[dir=rtl] .hero2 .eyebrow{letter-spacing:0}
html[dir=rtl] .badge,html[dir=rtl] .frame-bar .tag{letter-spacing:0}
html[dir=rtl] .frame-bar .url{direction:ltr;text-align:left}
html[dir=rtl] .mh{direction:rtl;font-family:"Noto Sans Arabic",Arial,Helvetica,sans-serif}
html[dir=rtl] .mh-eyebrow,html[dir=rtl] .mh-download small,html[dir=rtl] .mh-price{letter-spacing:0}
html[dir=rtl] .mh-live::before{margin-right:0;margin-left:8px}
html[dir=rtl] .mh-panelbtn,html[dir=rtl] .mh .mh-row,html[dir=rtl] .mh-download{text-align:right}
html[dir=rtl] .mh-panelbtn[aria-pressed=true]::after{margin-left:0;margin-right:auto}
html[dir=rtl] .mh-logo-preview button,html[dir=rtl] .mh .mh-logo-preview button.mh-x{margin-left:0;margin-right:auto}
html[dir=rtl] .mh input[type=range]{direction:ltr}
html[dir=rtl] .mh-text{text-align:right}
html[dir=rtl] .mh-text[id=mh-init-text]{direction:ltr;text-align:left}
html[dir=rtl] .mh-sizes,html[dir=rtl] .mh-qty{direction:ltr}
html[dir=rtl] .mh .mh-vel{padding:0 12px 0 18px}
html[dir=rtl] .mh .mh-editor .mh-vel{padding:0 12px 0 20px}
html[dir=rtl] .mh-canvas,html[dir=rtl] .mh-seg{direction:ltr}

/* Form hardening and accessibility additions */
.hp-field{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;}
.form-privacy-note{font-size:.88rem;line-height:1.55;color:var(--muted,#64748b);margin:.75rem 0;}
:focus-visible{outline:3px solid #00AA63;outline-offset:3px;}
input,select,textarea{max-width:100%;}