/* UI Previews v2: a visual refinement layer over the retained v1 templates. */
:root{--blue:#1761e8;--blue-dark:#1251c5;--blue-pale:#f0f5ff;--muted:#53647d;--width:1140px}
.site-header{height:66px}
.brand{font-size:24px;letter-spacing:-.8px}
.main-nav{gap:36px}
.site-footer{padding:16px 0}
.footer-note{font-size:10px}
.site-main{min-height:calc(100vh - 145px)}
.app-icon,.app-icon.violet,.app-icon.green,.app-icon.slate,.app-icon.orange,.app-icon.sky{background:transparent;border:0;border-radius:15px}
.app-icon img{width:100%;height:100%;display:block;object-fit:contain;filter:drop-shadow(0 3px 3px #17355b12)}
.app-card{transition:border-color .15s,box-shadow .15s}
.app-card:hover{transform:none;box-shadow:0 4px 16px #1f467808}
.guide-visual{position:relative;width:100%;height:160px;overflow:hidden;border-radius:7px;background:#edf2f7}
.guide-visual img{display:block;width:100%;height:100%;object-fit:cover}
.guide-visual.remote-visual img{object-position:50% 48%}
.guide-visual.tv-visual img{object-position:50% 51%}
.guide-visual.phone-visual img{object-position:50% 48%}
.guide-card .card-cover{padding:6px 6px 0}
.guide-card{display:flex;flex-direction:column}
.guide-card .card-body{display:flex;flex-direction:column;flex:1}
.guide-card .card-body>.text-link{align-self:flex-start;margin-top:auto}
.article-figure .guide-visual{height:300px}
.article-end .guide-visual{height:140px}
.result-row .app-icon{padding:0}
.app-related .app-icon{border-radius:12px}
.compact-row .row-icon{box-shadow:inset 0 1px 0 #fff8;border-radius:10px}
.compact-row:nth-child(1) .row-icon{color:white;background:#7d8796}
.compact-row:nth-child(2) .row-icon{color:white;background:#e95d43}
.compact-row:nth-child(3) .row-icon{color:white;background:#8960d4}
.compact-row .row-icon svg{width:23px;height:23px;stroke-width:1.9}
body[data-template=home] .site-main{padding-bottom:18px}
body[data-template=home] .hero{margin-top:10px;padding:30px 24px 24px;background:#f4f7fa}
body[data-template=home] .hero h1{font-size:44px;line-height:1.15;letter-spacing:-1.4px;margin-bottom:8px}
body[data-template=home] .hero p{font-size:16px;line-height:1.5;max-width:650px;margin-bottom:20px}
body[data-template=home] .hero .search-form{max-width:680px;padding:3px 3px 3px 18px}
body[data-template=home] .hero .chips{margin-top:12px;gap:12px}
body[data-template=home] .hero .chip{min-height:36px;padding:6px 17px;background:#ebf1f7;border-color:#dce5f0}
body[data-template=home] .hero .btn{min-height:44px;min-width:112px}
.home-content .section{margin-top:23px}
.home-content .section-heading{margin-bottom:12px;align-items:center}
.home-content .section-heading h2{font-size:24px;letter-spacing:-.6px}
.home-content .app-grid{gap:14px}
.home-content .app-card{min-height:184px;padding:14px 10px 12px;border-radius:10px}
.home-content .app-card .app-icon{width:66px;height:66px;margin:0 auto 9px}
.home-content .app-card :is(h2,h3){font-size:17px;letter-spacing:-.4px;margin-bottom:2px}
.home-content .app-card p{font-size:13px;margin-bottom:3px;line-height:1.5}
.home-content .app-card .text-link{min-height:32px;font-size:14px;gap:7px}
.featured-band{margin-top:18px;padding:17px 36px;gap:32px;min-height:118px;background:#f0f5fe;border-radius:12px}
.featured-band .app-icon{width:82px;height:82px;flex-shrink:0;border-radius:20px}
.featured-band .featured-copy{position:relative}
.featured-band .featured-title-row{display:flex;align-items:center;gap:12px;margin-bottom:5px;flex-wrap:wrap}
.featured-band h2{font-size:25px;letter-spacing:-.65px;margin:0}
.featured-band .owner-label{font-size:10px;line-height:1.3;color:#5a7090;white-space:nowrap;border-left:1px solid #cfdaeb;padding-left:11px}
.featured-band p{font-size:15px;line-height:1.6;margin:0}
.featured-band>.btn{min-width:188px;font-weight:500;background:transparent}
.home-content .compact-list{gap:8px}
.home-content .compact-row{min-height:62px;padding:10px 18px;gap:22px;border-radius:9px}
.home-content .compact-row .row-icon{width:42px;height:42px}
.home-content .compact-row :is(h2,h3){font-size:15px;line-height:1.25;margin-bottom:2px}
.home-content .compact-row p{font-size:12px;line-height:1.4}
.home-content .guide-grid{gap:18px}
.home-content .guide-card{border-radius:10px}
.home-content .guide-visual{height:104px;border-radius:7px}
.home-content .guide-card .card-body{padding:9px 13px 10px}
.home-content .guide-card :is(h2,h3){font-size:15px;line-height:1.3;letter-spacing:-.25px;margin-bottom:4px}
.home-content .guide-card p{font-size:12px;line-height:1.5;margin-bottom:3px}
.home-content .guide-card .text-link{font-size:13px;min-height:28px}
@media(min-width:1440px){:root{--width:1140px}.hero{max-width:1440px}}
@media(min-width:761px) and (max-width:1024px){.featured-band{padding-inline:25px;gap:23px}.featured-band .owner-label{border:0;padding:0}.featured-band .featured-title-row{gap:4px 10px}.featured-band>.btn{min-width:155px}.home-content .guide-visual{height:112px}.home-content .guide-card :is(h2,h3){font-size:14px}.home-content .guide-card p{font-size:12px}}
@media(max-width:760px){
  .site-header{height:64px}.brand{font-size:21px}.main-nav{top:63px;gap:0}.site-footer{padding:22px 0}.footer-note{font-size:10px}.guide-visual{height:180px}.article-figure .guide-visual{height:210px}.article-end .guide-visual{height:160px}
  body[data-template=home] .hero{margin-top:10px;padding:26px 17px 23px}
  body[data-template=home] .hero h1{font-size:34px;letter-spacing:-.9px;max-width:370px;line-height:1.14}
  body[data-template=home] .hero p{font-size:14px;line-height:1.6;margin:12px auto 19px}
  body[data-template=home] .hero .search-form{padding-left:12px}
  body[data-template=home] .hero .btn{min-width:82px;padding-inline:17px}
  body[data-template=home] .hero .chips{gap:7px;margin-top:13px}
  body[data-template=home] .hero .chip{padding:6px 12px;font-size:12px;min-height:34px}
  .home-content .section{margin-top:26px}.home-content .section-heading{align-items:flex-start;margin-bottom:13px}.home-content .section-heading h2{font-size:22px;letter-spacing:-.5px}.home-content .section-heading .text-link{font-size:12px;min-height:28px}
  .home-content .app-grid{gap:12px}.home-content .app-card{padding:17px 10px 13px;min-height:181px}.home-content .app-card .app-icon{width:66px;height:66px;margin-bottom:10px}.home-content .app-card :is(h2,h3){font-size:16px}.home-content .app-card p{font-size:12px}.home-content .app-card .text-link{font-size:13px}
  .featured-band{padding:22px;gap:17px;margin-top:18px;min-height:0}.featured-band .app-icon{width:68px;height:68px}.featured-band .featured-copy{flex-basis:calc(100% - 88px)}.featured-band .featured-title-row{gap:5px;margin-bottom:6px}.featured-band h2{font-size:21px;letter-spacing:-.45px}.featured-band .owner-label{padding:0;border:0;display:block;font-size:9px;width:100%;order:-1}.featured-band p{font-size:13px;line-height:1.6}.featured-band>.btn{margin-top:0;width:100%;min-height:44px}
  .home-content .compact-row{padding:12px;gap:13px;min-height:69px}.home-content .compact-row :is(h2,h3){font-size:14px}.home-content .compact-row p{font-size:12px;line-height:1.6}.home-content .compact-row .row-icon{width:40px;height:40px}
  .home-content .guide-grid{gap:16px}.home-content .guide-visual{height:158px}.home-content .guide-card .card-body{padding:13px 15px 14px}.home-content .guide-card :is(h2,h3){font-size:17px;line-height:1.4;margin-bottom:5px}.home-content .guide-card p{font-size:13px;margin-bottom:7px}.home-content .guide-card .text-link{font-size:13px;min-height:30px}
  body[data-template=home] .site-main{padding-bottom:30px}
}
@media(max-width:360px){.brand{font-size:19px}body[data-template=home] .hero h1{font-size:30px}body[data-template=home] .hero .chip{font-size:11px;padding-inline:9px}body[data-template=home] .hero .btn{min-width:72px;padding-inline:11px}.home-content .section-heading h2{font-size:20px}.home-content .section-heading .text-link{font-size:11px}.featured-band{padding:19px;gap:14px}.featured-band h2{font-size:19px}.featured-band .app-icon{width:60px;height:60px}.featured-band .featured-copy{flex-basis:calc(100% - 75px)}.home-content .guide-visual{height:143px}}
