/* Fantasy theme overlay; does not alter pricing or workflow. */
body{background:radial-gradient(ellipse at 50% 0%,#39205e,transparent 55%),linear-gradient(140deg,#060b29,#18113e 55%,#070d29)}
.app-shell{max-width:1536px}
.topbar{border:1px solid #d89a65;background:radial-gradient(ellipse at 80% 0%,#572b69,transparent 60%),linear-gradient(120deg,#080d32,#211043);box-shadow:0 0 32px #7c3f7755}
.brand-mark{border:1px solid #ffe1a4;border-radius:50%;background:#29123e;color:#ffd38c;font-size:2.4rem;text-shadow:0 0 14px #ffb34b}
.brand-row h1{color:#ffdda2;font-family:Georgia,serif;letter-spacing:.05em}
.service-hub{background:linear-gradient(135deg,#111841,#241344);border-color:#b56cbb}
.service-card{background:linear-gradient(140deg,#32226a,#10295b);border:1px solid #ad7dd4;box-shadow:0 8px 20px #0005;transition:transform .2s}
.service-card:nth-child(4n+2){background:linear-gradient(140deg,#642257,#301556)}
.service-card:nth-child(4n+3){background:linear-gradient(140deg,#14536b,#172351)}
.service-card:hover{transform:translateY(-3px)}
.service-card strong{color:#fff3d5}
@media(prefers-reduced-motion:reduce){.service-card{transition:none}}

/* 2026-10-25: mobile-first romantic night theme, presentation only */
body{background:radial-gradient(circle at 82% 5%,rgba(255,201,225,.18),transparent 29%),radial-gradient(circle at 8% 18%,rgba(174,107,198,.28),transparent 38%),linear-gradient(165deg,#10112f 0%,#291842 48%,#130d30 100%)}
.topbar{position:relative;overflow:hidden;background:radial-gradient(circle at 83% 17%,rgba(255,225,178,.25) 0 7%,transparent 8%),radial-gradient(ellipse at 85% 20%,rgba(242,143,187,.27),transparent 48%),linear-gradient(120deg,#151633,#422450 78%,#342244);border:1px solid rgba(249,183,211,.65);box-shadow:0 16px 50px rgba(14,7,35,.4)}
.topbar:after{content:'✦  ✧   ✦';position:absolute;right:6%;top:18%;font-size:26px;color:rgba(255,222,179,.65);pointer-events:none}
.brand-mark{width:80px;height:80px;display:grid;place-items:center;overflow:hidden;border:2px solid #f6c67d;border-radius:50%;background:#fff;box-shadow:0 0 24px rgba(252,184,120,.38);font-size:initial;text-shadow:none;flex-shrink:0}
.brand-mark img{display:block;width:100%;height:100%;object-fit:contain}
.topbar-copy{max-width:680px;line-height:1.7;color:#fbe6f2}
.service-hub{background:linear-gradient(145deg,rgba(45,25,75,.95),rgba(26,30,70,.96));border-color:rgba(235,157,201,.55)}
.service-hub-head h2{color:#ffe1ee}
.service-card{border-color:rgba(238,172,219,.38);border-radius:20px;box-shadow:0 9px 25px rgba(7,8,31,.28)}
.service-card:nth-child(4n+2){background:linear-gradient(145deg,#6a285e,#36224e)}
.service-card:nth-child(4n+3){background:linear-gradient(145deg,#354c88,#202b56)}
.service-card:nth-child(4n+4){background:linear-gradient(145deg,#625039,#332444)}
@media(max-width:720px){.topbar{padding:20px 16px}.brand-mark{width:62px;height:62px}.topbar:after{font-size:17px;top:10%}.service-hub{gap:15px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.service-card{min-height:130px;padding:12px}.service-card strong{font-size:.94rem}.service-card span,.service-card small{font-size:.78rem}}

/* Phone-first landing presentation: retains original controls and business logic. */
@media (max-width:600px){
  .app-shell{padding:10px 10px 28px;max-width:100%;overflow-x:clip}
  .topbar{min-height:390px;padding:18px 16px 22px;align-content:space-between;gap:12px;border-radius:26px;background:radial-gradient(circle at 80% 28%,rgba(255,235,192,.78) 0 9%,rgba(251,177,206,.2) 10%,transparent 29%),radial-gradient(ellipse at 70% 58%,rgba(228,109,164,.3),transparent 55%),linear-gradient(155deg,#111333 0%,#34204c 62%,#703d6a 100%);box-shadow:0 14px 36px rgba(12,5,35,.45)}
  .topbar:after{content:'✧    ✦      ✧';top:27%;right:7%;font-size:20px;letter-spacing:9px}
  .brand-row{position:relative;z-index:1;gap:10px;align-items:center}
  .brand-mark{width:62px;height:62px;min-width:62px;box-shadow:0 0 22px rgba(255,208,141,.56)}
  .eyebrow{font-size:10px;letter-spacing:.06em;color:#f8d8a7}
  .brand-row h1{font-size:25px;line-height:1.1;color:#ffe6b6}
  .topbar-copy{position:relative;z-index:1;font-size:18px;font-weight:650;line-height:1.65;color:#fff1f6;text-wrap:balance;text-shadow:0 2px 14px #12091d}
  .topbar-actions{position:relative;z-index:1;grid-template-columns:1fr;gap:8px}
  #start-btn{min-height:54px;border-radius:999px;background:linear-gradient(110deg,#ffd3e4,#f79fc6);border:1px solid #fff2f8;color:#5b1643;font-weight:800;font-size:16px;box-shadow:0 8px 18px rgba(52,10,47,.25)}
  #view-notice-btn{min-height:36px;border:1px solid rgba(255,232,244,.45);background:rgba(255,255,255,.07);color:#fff3fa;font-size:12px}
  .service-hub{padding:16px 12px;border-radius:23px;gap:14px}
  .service-hub-head h2{font-size:21px;line-height:1.35}
  .hub-copy{font-size:13px;line-height:1.6}
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .service-card{min-width:0;min-height:146px;padding:12px 10px;gap:7px;border-radius:17px}
  .service-card strong{font-size:14px;line-height:1.35;overflow-wrap:anywhere}
  .service-card span,.service-card small{font-size:11px;line-height:1.45;overflow-wrap:anywhere}
  .service-icon{font-size:26px}
  .service-index{font-size:10px;opacity:.7}
  .hub-utility{width:100%;justify-content:flex-start;gap:8px}
  .hub-utility button{min-height:40px}
}
@media(max-width:355px){.service-grid{grid-template-columns:1fr}.service-card{min-height:110px}.topbar-copy{font-size:16px}}

/* Preserve complete official logo on mobile without circular clipping. */
.brand-mark{overflow:visible!important;border-radius:12px!important}
.brand-mark img{object-fit:contain!important;width:100%!important;height:100%!important}

/* Ensure official logo remains visibly sized on mobile and desktop. */
.topbar .brand-row .brand-mark{width:104px!important;height:104px!important;min-width:104px!important;min-height:104px!important;overflow:visible!important;background:#fff!important;display:grid!important;place-items:center!important}
.topbar .brand-row .brand-mark img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important;opacity:1!important;visibility:visible!important}
@media(max-width:600px){.topbar .brand-row .brand-mark{width:88px!important;height:88px!important;min-width:88px!important;min-height:88px!important}}