.support-web{padding:clamp(1rem,3vw,2rem);color:inherit;font:inherit}
.support-web-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin-bottom:1.5rem}
.support-web .nice_button{display:inline-flex;align-items:center;justify-content:center;text-align:center;min-height:2.6rem;padding:.55rem 1rem;color:inherit;background:rgba(0,0,0,.24);border:1px solid rgba(160,170,190,.28);border-radius:.35rem;font:inherit;text-decoration:none;transition:background .15s,border-color .15s}
.support-web .nice_button:hover,.support-web .nice_button:focus-visible{background:rgba(130,150,185,.14);border-color:currentColor}
.support-web-search{margin:0 0 2rem}.support-web-search label{display:block;margin-bottom:.5rem}.support-web-search>div{display:flex;gap:.6rem;flex-wrap:wrap}.support-web-search input{flex:1;min-width:12rem;margin:0;padding:.65rem .85rem;color:inherit;background:rgba(0,0,0,.24);border:1px solid rgba(160,170,190,.3);border-radius:.35rem;font:inherit}.support-web-search input::placeholder{color:inherit;opacity:.65}
.support-web-features{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem;margin:0 0 2rem}
.support-web-feature{display:flex;align-items:stretch;min-height:7rem;border:1px solid rgba(160,170,190,.35);border-radius:.35rem;background-color:#18181b;background-size:cover;background-position:center;color:#f5c34e;text-decoration:none;overflow:hidden}
.support-web-feature span{display:flex;align-items:center;width:100%;padding:1rem 35% 1rem 1rem;background:linear-gradient(90deg,rgba(0,0,0,.85) 30%,rgba(0,0,0,.4) 65%,transparent);font-weight:bold}
.support-web-feature:hover,.support-web-feature:focus-visible{border-color:currentColor;filter:brightness(1.12)}
.support-web-feature-icecrown{background-image:url(../images/icecrown.jpg)}.support-web-feature-lich-king{background-image:url(../images/lich-king.jpg)}.support-web-feature-loot{background-image:url(../images/loot.jpg)}.support-web-feature-northrend{background-image:url(../images/northrend.jpg)}
.support-web-columns{display:grid;grid-template-columns:1.3fr 1fr;gap:2rem;margin:0 0 2rem}.support-web-columns h3,.support-web-services h3,.support-web-community h3{font:inherit;font-weight:bold;font-size:1.15em;margin:0 0 .8rem}
.support-web-categories{display:grid;grid-template-columns:repeat(auto-fit,minmax(10rem,1fr));gap:1rem;margin:0}
.support-web-categories>a{display:block;padding:1rem;border:1px solid rgba(160,170,190,.28);border-radius:.35rem;text-decoration:none;background:rgba(0,0,0,.18)}.support-web-categories>a:hover,.support-web-categories>a:focus-visible{border-color:currentColor}.support-web-categories h4{font:inherit;font-weight:bold;margin:0 0 .4rem}.support-web-categories p{font:inherit;font-size:.95em;margin:0;color:inherit}
.support-web-articles{padding-left:1.4rem;margin:0 0 1rem}.support-web-articles li{margin:.6rem 0}.support-web-article{max-width:60rem}.support-web-article p{line-height:1.6}
.support-web-accordions{margin:0 0 2rem}.support-web-accordion{border:1px solid rgba(160,170,190,.28);border-radius:.35rem;background:rgba(0,0,0,.18);margin:0 0 .6rem}.support-web-accordion summary{padding:.9rem 1rem;cursor:pointer;font-weight:bold;list-style:none;display:flex;align-items:center}.support-web-accordion summary::-webkit-details-marker{display:none}.support-web-accordion summary:after{content:"+";margin-left:auto;font-size:1.4em;line-height:1}.support-web-accordion[open] summary:after{content:"−"}.support-web-accordion>div{padding:0 1rem 1rem}
.support-web-services ul,.support-web-community ul{list-style:none;padding:0;margin:0}.support-web-services li{margin:0 0 1rem}.support-web-services li p{margin:.25rem 0 0;opacity:.85}.support-web-community{margin-top:1.5rem}.support-web-community li{margin:.4rem 0}
@media(max-width:760px){.support-web-columns{grid-template-columns:1fr}}

/* El centro web hereda el tema; el navegador del juego usa su propia hoja. */
.support-web { --help-accent:#a9d2eb; --help-border:#acc8dc38; --help-panel:rgba(20,27,35,.95); color:#eeeae4; font:15px/1.6 Roboto,Arial,sans-serif; padding:clamp(18px,3vw,34px); }
.variation-undying .support-web { --help-accent:#e5cd86; --help-border:#c5a56a40; --help-panel:rgba(27,25,24,.96); }
.support-web a { color:var(--help-accent); }
.support-web h2 { font-size:clamp(24px,3vw,34px); margin:12px 0 26px; color:var(--help-accent); }
.support-web h3,.support-web h4 { font-family:Roboto,Arial,sans-serif; letter-spacing:normal; text-transform:none; }
.support-web-actions { padding:12px; border:1px solid var(--help-border); border-radius:12px; background:var(--help-panel); gap:8px; }
.support-web .nice_button { font:500 14px/1.4 Roboto,Arial,sans-serif; letter-spacing:normal; text-transform:none; border-color:var(--help-border); border-radius:7px; padding:11px 18px; min-height:44px; color:var(--help-accent); background:rgba(200,175,120,.045); }
.support-web .nice_button::before,.support-web .nice_button::after { content:none; }
.support-web .nice_button:focus-visible,.support-web summary:focus-visible { outline:2px solid var(--help-accent); outline-offset:3px; }
.support-web-search { background:var(--help-panel); border:1px solid var(--help-border); padding:24px; border-radius:12px; }
.support-web .support-web-search label { font:500 15px/1.5 Roboto,Arial,sans-serif; margin-bottom:12px; }
.support-web .support-web-search input { font:15px/1.5 Roboto,Arial,sans-serif; letter-spacing:normal; min-height:46px; border-color:var(--help-border); border-radius:7px; text-transform:none; }
.support-web-feature { border-color:var(--help-border); border-radius:12px; min-height:135px; box-shadow:inset 0 1px 0 #ffffff0a,0 8px 22px #0002; }
.support-web-feature span { padding:24px 30% 24px 22px; font:600 17px/1.4 Roboto,Arial,sans-serif; color:#f3e1b6; }
.support-web-columns { gap:22px; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); }
.support-web-columns>section,.support-web-services,.support-web-community,.support-web-article { padding:26px; border:1px solid var(--help-border); border-radius:12px; background:var(--help-panel); }
.support-web-columns h3,.support-web-services h3,.support-web-community h3 { color:var(--help-accent); font-size:18px; margin-bottom:20px; }
.support-web .support-web-categories { gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
.support-web-categories>a { border-color:var(--help-border); border-radius:9px; padding:17px; background:linear-gradient(135deg,#ffffff07,transparent); }
.support-web-categories h4 { color:var(--help-accent); font-size:15px; }
.support-web-categories p { color:#c6c0b8; font-size:13px; line-height:1.6; }
.support-web-articles { list-style:none; padding:0; }
.support-web-articles li { padding:12px 0; margin:0; border-bottom:1px solid var(--help-border); }
.support-web-articles li:last-child { border-bottom:0; }
.support-web-articles a { display:block; font-size:14px; line-height:1.6; }
.support-web-accordion { border-color:var(--help-border); background:var(--help-panel); border-radius:10px; margin-bottom:10px; }
.support-web-accordion summary { min-height:58px; padding:16px 22px; color:var(--help-accent); font:500 15px/1.5 Roboto,Arial,sans-serif; }
.support-web-accordion summary:after { display:inline-flex; align-items:center; justify-content:center; width:24px; height:24px; flex-shrink:0; }
.support-web-accordion>div { padding:0 22px 22px; }
.support-web-services ul { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:20px; }
.support-web-services li { margin:0; }
.support-web-community ul { display:flex; flex-wrap:wrap; gap:12px 26px; }
@media(max-width:900px) { .support-web-columns { grid-template-columns:1fr; } }
@media(max-width:575px) { .support-web .support-web-categories { grid-template-columns:1fr; } .support-web-actions>a { width:100%; } .support-web-search { padding:18px; } .support-web-search input { min-width:0; width:100%; flex-basis:100%; } .support-web-search button { width:100%; } .support-web-columns>section,.support-web-services,.support-web-community,.support-web-article { padding:20px; } }
