.hm-themes { --hm-red:#d71920; --hm-dark:#171719; --hm-muted:#68686f; --hm-paper:#f6f4f1; color:var(--hm-dark); }
.hm-themes * { box-sizing:border-box; }
.hm-themes-hero { padding:8.5rem 0 7rem; background:linear-gradient(135deg,#fbfaf8 0%,#f2eeea 100%); overflow:hidden; }
.hm-themes-hero-inner { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.88fr); gap:clamp(4rem,8vw,10rem); align-items:center; }
.hm-themes-kicker,.hm-themes-eyebrow { display:block; margin-bottom:1.5rem; color:var(--hm-red); font-size:1.2rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.hm-themes-hero h1 { max-width:760px; margin:0; font-size:clamp(4.6rem,6.2vw,8rem); line-height:.98; letter-spacing:-.055em; }
.hm-themes-hero-copy>p { max-width:680px; margin:2.4rem 0 0; color:#535359; font-size:clamp(1.75rem,2vw,2.15rem); line-height:1.6; }
.hm-themes-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:2.4rem; margin-top:3.2rem; }
.hm-themes-button { display:inline-flex; align-items:center; justify-content:center; gap:1.2rem; min-height:5.4rem; padding:1.4rem 2.4rem; border-radius:.8rem; background:var(--hm-red); color:#fff; font-size:1.5rem; font-weight:800; text-decoration:none; transition:transform .2s ease,box-shadow .2s ease; }
.hm-themes-button:hover { color:#fff; transform:translateY(-2px); box-shadow:0 12px 24px rgba(215,25,32,.2); }
.hm-themes-text-link { color:var(--hm-dark); font-size:1.5rem; font-weight:750; text-decoration:none; }
.hm-themes-text-link:hover { color:var(--hm-red); }
.hm-themes-hero-image,.hm-themes-browser { position:relative; margin:0; transform:rotate(1.5deg); filter:drop-shadow(0 24px 35px rgba(31,25,21,.16)); }
.hm-themes-hero-image img { display:block; width:100%; aspect-ratio:4/3; border:9px solid #fff; border-radius:1.4rem; object-fit:cover; }
.hm-themes-browser { overflow:hidden; border:9px solid #fff; border-radius:1.4rem; background:#fff; }
.hm-themes-browser-bar { display:flex; align-items:center; gap:.6rem; height:4.2rem; padding:0 1.4rem; background:#f0efed; }
.hm-themes-browser-bar i { width:.8rem; height:.8rem; border-radius:50%; background:#ccc; }.hm-themes-browser-bar i:first-child { background:var(--hm-red); }.hm-themes-browser-bar span { margin-left:1rem; color:#999; font-size:1rem; }
.hm-themes-browser-body { min-height:310px; padding:5rem 4.5rem; background:linear-gradient(145deg,#fff 55%,#f4e9e7); }.hm-themes-browser-body>span { color:var(--hm-red); font-size:1rem; font-weight:900; letter-spacing:.18em; }.hm-themes-browser-body>strong { display:block; margin-top:1.6rem; font-size:clamp(2.8rem,4vw,4.7rem); line-height:1.04; letter-spacing:-.05em; }.hm-themes-browser-body>div { display:flex; gap:1rem; margin-top:4rem; }.hm-themes-browser-body>div i { width:30%; height:5rem; border-radius:.5rem; background:#e8e4df; }.hm-themes-browser-body>div i:first-child { background:var(--hm-red); }
.hm-themes-benefits { position:relative; z-index:2; margin-top:-2rem; }.hm-themes-benefit-grid { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid #e7e3df; border-radius:1rem; background:#fff; box-shadow:0 15px 40px rgba(28,23,19,.07); }.hm-themes-benefit-grid>div { position:relative; padding:3rem 3.2rem 3rem 7rem; }.hm-themes-benefit-grid>div+div { border-left:1px solid #e7e3df; }.hm-themes-benefit-grid span { position:absolute; left:3rem; top:3rem; color:var(--hm-red); font-size:1.15rem; font-weight:900; }.hm-themes-benefit-grid strong { display:block; font-size:1.7rem; }.hm-themes-benefit-grid small { display:block; margin-top:.7rem; color:var(--hm-muted); font-size:1.35rem; line-height:1.55; }
.hm-themes-catalog,.hm-themes-about,.hm-themes-faq { padding:10rem 0; }.hm-themes-section-head { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(280px,.7fr); gap:5rem; align-items:end; margin-bottom:4.5rem; }.hm-themes-section-head h2,.hm-themes-about h2,.hm-themes-faq h2,.hm-themes-custom h2 { margin:0; font-size:clamp(3.2rem,4.5vw,5.2rem); line-height:1.05; letter-spacing:-.045em; }.hm-themes-section-head>p { margin:0 0 .4rem; color:var(--hm-muted); font-size:1.6rem; line-height:1.65; }
.hm-theme-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3.2rem; }.hm-theme-card { overflow:hidden; border:1px solid #e3dfda; border-radius:1.2rem; background:#fff; transition:transform .2s ease,box-shadow .2s ease; }.hm-theme-card:hover { transform:translateY(-4px); box-shadow:0 20px 45px rgba(25,22,19,.1); }.hm-theme-preview { position:relative; display:block; overflow:hidden; aspect-ratio:16/10; background:#e9e5e0; }.hm-theme-preview img { width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }.hm-theme-card:hover .hm-theme-preview img { transform:scale(1.025); }.hm-theme-status { position:absolute; top:1.8rem; left:1.8rem; padding:.7rem 1rem; border-radius:.45rem; background:var(--hm-red); color:#fff; font-size:1.1rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.hm-theme-placeholder { display:flex; height:100%; align-items:center; justify-content:center; flex-direction:column; color:var(--hm-red); }.hm-theme-placeholder b { font-size:5rem; line-height:1; }.hm-theme-placeholder small { margin-top:1rem; color:#777; text-transform:uppercase; letter-spacing:.15em; }
.hm-theme-card-body { padding:3rem; }.hm-theme-card-title { display:flex; justify-content:space-between; gap:2rem; align-items:baseline; }.hm-theme-card-title h3 { margin:0; font-size:2.8rem; letter-spacing:-.035em; }.hm-theme-card-title h3 a { color:inherit; text-decoration:none; }.hm-theme-card-title>span { flex:0 0 auto; color:#888; font-size:1.2rem; }.hm-theme-card-body>p { min-height:5.2rem; margin:1.4rem 0 2rem; color:var(--hm-muted); font-size:1.5rem; line-height:1.7; }.hm-theme-card-body ul { display:flex; flex-wrap:wrap; gap:.8rem; margin:0 0 2.5rem; padding:0; list-style:none; }.hm-theme-card-body li { padding:.65rem .9rem; border-radius:.4rem; background:var(--hm-paper); color:#535359; font-size:1.15rem; font-weight:700; }.hm-theme-card-link { display:flex; justify-content:space-between; padding-top:2rem; border-top:1px solid #ece8e4; color:var(--hm-dark); font-size:1.45rem; font-weight:850; text-decoration:none; }.hm-theme-card-link:hover { color:var(--hm-red); }
.hm-themes-empty { padding:6rem 3rem; border:1px dashed #d4cdc6; border-radius:1rem; background:var(--hm-paper); text-align:center; }.hm-themes-empty>span { color:var(--hm-red); font-size:3rem; }.hm-themes-empty h3 { margin:1rem 0; font-size:2.5rem; }.hm-themes-empty p { margin:0; color:var(--hm-muted); }
.hm-themes-about { background:var(--hm-paper); }.hm-themes-about-grid { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(330px,.75fr); gap:clamp(5rem,9vw,12rem); align-items:center; }.hm-themes-about-copy p { margin:2rem 0 0; color:#55555b; font-size:1.65rem; line-height:1.8; }.hm-themes-checklist { padding:3.5rem; border-top:5px solid var(--hm-red); border-radius:.8rem; background:#fff; box-shadow:0 18px 40px rgba(30,25,20,.08); }.hm-themes-checklist>span { color:var(--hm-red); font-size:1.15rem; font-weight:900; letter-spacing:.11em; text-transform:uppercase; }.hm-themes-checklist ul { margin:2rem 0 0; padding:0; list-style:none; }.hm-themes-checklist li { display:flex; gap:1.5rem; padding:1.8rem 0; }.hm-themes-checklist li+li { border-top:1px solid #eeeae6; }.hm-themes-checklist li>b { color:var(--hm-red); }.hm-themes-checklist strong,.hm-themes-checklist small { display:block; }.hm-themes-checklist strong { font-size:1.5rem; }.hm-themes-checklist small { margin-top:.4rem; color:var(--hm-muted); font-size:1.3rem; line-height:1.5; }
.hm-themes-editor { padding:8rem 0; }.hm-themes-custom { margin:8rem 0; }.hm-themes-editor+.hm-themes-custom { margin-top:0; }.hm-themes-custom-box { position:relative; isolation:isolate; display:flex; justify-content:space-between; align-items:center; gap:5rem; overflow:hidden; padding:5.5rem 6rem; border:1px solid rgba(255,255,255,.2); border-radius:2rem; background:linear-gradient(125deg,#b90f18 0%,#d71920 55%,#ed4a42 100%); color:#fff; box-shadow:0 24px 55px rgba(154,18,25,.2); }.hm-themes-custom-box::before,.hm-themes-custom-box::after { content:""; position:absolute; z-index:-1; border-radius:50%; background:rgba(255,255,255,.09); }.hm-themes-custom-box::before { width:28rem; height:28rem; top:-19rem; right:18%; }.hm-themes-custom-box::after { width:18rem; height:18rem; right:-6rem; bottom:-10rem; }.hm-themes-custom-box>div>span { color:#ffe1df; font-size:1.2rem; font-weight:850; letter-spacing:.1em; text-transform:uppercase; }.hm-themes-custom h2 { margin-top:.8rem; color:#fff; }.hm-themes-custom p { max-width:720px; margin:1.5rem 0 0; color:#fff; font-size:1.55rem; line-height:1.7; opacity:.92; }.hm-themes-button.is-light { flex:0 0 auto; border:1px solid rgba(255,255,255,.75); background:#fff; color:#8f1016; box-shadow:0 12px 25px rgba(83,7,11,.18); }.hm-themes-button.is-light:hover { color:#d71920; box-shadow:0 16px 30px rgba(83,7,11,.24); }
.hm-themes-faq { border-top:1px solid #ebe7e3; }.hm-themes-faq-inner { display:grid; grid-template-columns:.65fr 1.35fr; gap:7rem; }.hm-themes-faq-list details { border-bottom:1px solid #dedad5; }.hm-themes-faq-list summary { padding:2rem 3.5rem 2rem 0; cursor:pointer; font-size:1.65rem; font-weight:800; list-style:none; }.hm-themes-faq-list summary::-webkit-details-marker { display:none; }.hm-themes-faq-list summary::after { content:'+'; float:right; margin-right:-3rem; color:var(--hm-red); font-size:2rem; }.hm-themes-faq-list details[open] summary::after { content:'−'; }.hm-themes-faq-list p { margin:-.4rem 0 2.2rem; color:var(--hm-muted); font-size:1.45rem; line-height:1.75; }
@media (max-width:900px) { .hm-themes-hero-inner,.hm-themes-about-grid { grid-template-columns:1fr; }.hm-themes-hero-image,.hm-themes-browser { max-width:650px; }.hm-themes-benefit-grid { grid-template-columns:1fr; }.hm-themes-benefit-grid>div+div { border-top:1px solid #e7e3df; border-left:0; }.hm-themes-section-head,.hm-themes-faq-inner { grid-template-columns:1fr; gap:2rem; }.hm-themes-custom-box { align-items:flex-start; flex-direction:column; } }
@media (max-width:700px) { .hm-themes .gh-inner { width:100%; padding-right:2rem; padding-left:2rem; }.hm-themes-hero { padding:6rem 0 5rem; }.hm-themes-hero-inner { gap:4rem; }.hm-themes-hero h1 { font-size:4.5rem; }.hm-themes-browser-body { min-height:240px; padding:4rem 2.5rem; }.hm-themes-catalog,.hm-themes-about,.hm-themes-faq { padding:7rem 0; }.hm-theme-grid { grid-template-columns:1fr; }.hm-theme-card-body { padding:2.3rem; }.hm-theme-card-title { align-items:flex-start; flex-direction:column; gap:.5rem; }.hm-theme-card-body>p { min-height:0; }.hm-themes-custom { margin:5rem 0; }.hm-themes-custom-box { padding:4rem 2.5rem; border-radius:1.4rem; }.hm-themes-custom h2 { font-size:3.4rem; }.hm-themes-editor { padding:6rem 2rem; }.hm-themes-editor .gh-canvas { width:100%; max-width:100%; padding-right:0; padding-left:0; } }
@media (prefers-reduced-motion:reduce) { .hm-theme-card,.hm-theme-preview img,.hm-themes-button { transition:none; } }