/* STARICO detail page — sits on the TEMMA paper colour, brown + orange from the official logo as accents */
.st{--brown:#5F3B13;--orange:#E9772F;--orange-d:#C95A16;--soft:#FBF3EA;--script:'Pinyon Script',cursive;color:#2A231C}
.st-wrap{max-width:1180px;margin:0 auto;padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.st .ic{width:1.25em;height:1.25em;flex:none;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}

/* header */
.st-hd{position:sticky;top:0;z-index:20;background:rgba(244,242,236,.94);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-bottom:1px solid transparent}
.st-hd-in{display:flex;align-items:center;gap:32px;min-height:84px;padding-top:env(safe-area-inset-top,0px)}
.st-logo{line-height:0;margin-right:auto}
.st-logo img{width:168px;height:auto}
.st-nav{display:flex;gap:28px}
.st-nav a{display:inline-flex;align-items:center;gap:7px;font-size:13.5px;letter-spacing:.08em;color:#2A231C}
.st-nav a .ic{color:var(--orange)}
.st-nav a:hover{color:var(--orange-d)}

/* buttons */
.st-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 30px;border-radius:999px;background:var(--orange-d);color:#fff;font-size:15px;letter-spacing:.12em;font-weight:500;box-shadow:0 6px 18px rgba(201,90,22,.22);transition:background .2s}
.st-btn:hover{background:#A9480F;color:#fff}
.st-btn.sm{min-height:44px;padding:0 22px;font-size:14px}
.st-btn.gacha{background:linear-gradient(90deg,#F28A3C,#E2611B);border:0;font-family:inherit;cursor:pointer;gap:12px}
.st-btn.gacha:hover{background:linear-gradient(90deg,#E07A2E,#C9520F)}
.st-btn.gacha .ic{width:1.35em;height:1.35em}
.st-btn.gacha .ic:first-child{width:1.6em;height:1.6em;stroke-width:1.4}
.st-btn.gacha.lg{min-height:76px;padding:0 40px 0 28px;gap:16px;border-radius:999px}
.st-btn.gacha.lg .ic:first-child{width:2.4em;height:2.4em;stroke-width:1.2}
.st-btn-2l{display:flex;flex-direction:column;align-items:flex-start;line-height:1.35;text-align:left}
.st-btn-2l small{font-size:12px;letter-spacing:.1em;opacity:.92;font-weight:400}
.st-btn-2l b{font-size:19px;letter-spacing:.12em;font-weight:600}
.st-toast{position:fixed;left:50%;width:max-content;bottom:max(24px,env(safe-area-inset-bottom,0px));transform:translate(-50%,12px);z-index:50;max-width:calc(100% - 32px);background:#2A231C;color:#fff;font-size:13.5px;letter-spacing:.06em;line-height:1.7;padding:12px 20px;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.25);opacity:0;transition:opacity .25s,transform .25s}
.st-toast.show{opacity:1;transform:translate(-50%,0)}

/* hero */
.st-hero{position:relative;min-height:min(640px,78vh);display:flex;align-items:center;overflow:hidden}
.st-hero-pic{position:absolute;inset:0;line-height:0}
.st-hero-pic img{width:100%;height:100%;object-fit:cover;object-position:70% 18%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18%);mask-image:linear-gradient(90deg,transparent 0,#000 18%)}
.st-hero-in{position:relative;width:100%;padding-block:72px}
.st-hero-txt{max-width:520px}
.st-hero h1{margin:0 0 28px;font-size:clamp(34px,4.2vw,52px);font-weight:500;letter-spacing:.1em;line-height:1.5;color:#2A231C}
.st-lead{margin:0;font-size:15px;letter-spacing:.08em;line-height:2.1}
.st-script{margin:28px 0 0;font-family:var(--script);font-size:26px;line-height:1.2;color:var(--orange);transform:rotate(-8deg);transform-origin:left center}

/* features */
.st-feat ul{list-style:none;margin:0;padding:36px 0;display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.st-feat li{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:4px 16px;font-size:13.5px;letter-spacing:.08em;line-height:1.9}
.st-feat li + li{border-left:1px solid var(--line)}
.st-feat .ic{width:34px;height:34px;color:var(--orange);stroke-width:1.3}

/* sections */
.st-sec{padding-block:80px 0}
.st-h2{display:flex;align-items:center;justify-content:center;gap:28px;margin:0 0 44px;font-size:clamp(22px,2.4vw,28px);font-weight:500;letter-spacing:.14em;color:#2A231C;text-align:center}
.st-h2::before,.st-h2::after{content:"";width:min(160px,14vw);height:1px;background:var(--orange);opacity:.55}
.st-h2 b{font-family:var(--en);font-size:1.6em;font-weight:500;font-style:italic;color:var(--orange);margin:0 .08em;line-height:1}

/* steps */
.st-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.st-steps li{position:relative;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:18px;align-items:center;padding-top:16px}
.st-badge{position:absolute;top:0;left:0;z-index:1;background:var(--orange);color:#fff;font-family:var(--en);font-size:14px;letter-spacing:.12em;padding:2px 14px;border-radius:6px 6px 6px 0}
.st-steps figure{margin:0;line-height:0;border-radius:6px;overflow:hidden;box-shadow:0 6px 16px rgba(95,59,19,.12)}
.st-steps img{width:100%;aspect-ratio:4/3;object-fit:cover}
.st-steps h3{margin:0 0 8px;font-size:17px;font-weight:600;letter-spacing:.1em}
.st-steps p{margin:0;font-size:13px;letter-spacing:.05em;line-height:1.9;color:var(--mute)}
.st-steps li:not(:last-child)::after{content:"";position:absolute;right:-26px;top:50%;width:10px;height:10px;border-top:1.5px solid var(--orange);border-right:1.5px solid var(--orange);transform:rotate(45deg)}

/* prizes */
.st-prizes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.st-prizes li{background:var(--white);border-radius:8px;overflow:hidden;box-shadow:0 8px 22px rgba(95,59,19,.08);text-align:center;padding-bottom:24px}
.st-prizes figure{margin:0;line-height:0}
.st-prizes img{width:100%;aspect-ratio:3/2;object-fit:cover}
.st-prizes h3{margin:20px 0 10px;font-size:19px;font-weight:600;letter-spacing:.12em}
.st-prizes p{margin:0;padding:0 16px;font-size:13px;letter-spacing:.04em;line-height:1.9;color:var(--mute)}
.st-note{margin:18px 0 0;text-align:center;font-size:12px;letter-spacing:.04em;color:var(--mute)}

/* fan + request */
.st-fan{position:relative;overflow:hidden;background:var(--soft);border-radius:10px 10px 0 0;min-height:200px;aspect-ratio:3/1;display:flex;align-items:center}
.st-fan-pic{position:absolute;inset:0;line-height:0}
.st-fan-pic img{width:100%;height:100%;object-fit:cover;object-position:right center}
.st-fan-txt{position:relative;padding:36px 48px}
.st-fan h2{margin:0 0 14px;font-size:24px;font-weight:500;letter-spacing:.16em}
.st-fan ul{list-style:none;margin:0;padding:0}
.st-fan li{position:relative;padding-left:30px;font-size:14.5px;letter-spacing:.06em;line-height:2.1}
.st-fan li::before{content:"";position:absolute;left:4px;top:.62em;width:12px;height:7px;border-left:2px solid var(--orange);border-bottom:2px solid var(--orange);transform:rotate(-45deg)}
.st-req{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:28px;align-items:center;background:var(--white);border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;padding:32px 48px}
.st-req > .ic{width:48px;height:48px;color:var(--orange);stroke-width:1.2}
.st-req h2{margin:0 0 8px;font-size:26px;font-weight:500;letter-spacing:.14em}
.st-req p{margin:0;font-size:13px;letter-spacing:.04em;line-height:1.9;color:var(--mute)}

/* faq */
.st-faq{padding-bottom:96px;scroll-margin-top:96px}
.st-faq-wait{margin:0 auto;max-width:760px;padding:40px 24px;text-align:center;border:1px solid var(--line);background:var(--white);border-radius:8px;letter-spacing:.2em;color:var(--mute)}
.st-faq-list{max-width:860px;margin:0 auto;border-top:1px solid var(--line)}
.st-faq-list details{border-bottom:1px solid var(--line)}
.st-faq-list summary{display:flex;align-items:baseline;gap:14px;padding:22px 8px;cursor:pointer;list-style:none;font-size:15.5px;letter-spacing:.06em;line-height:1.8}
.st-faq-list summary::-webkit-details-marker{display:none}
.st-faq-list .q{font-family:var(--en);font-size:20px;color:var(--orange);flex:none;min-width:2.2em}
.st-faq-list .t{flex:1;min-width:0}
.st-faq-list summary i{position:relative;flex:none;width:14px;height:14px;align-self:center}
.st-faq-list summary i::before,.st-faq-list summary i::after{content:"";position:absolute;left:0;top:6.5px;width:14px;height:1.5px;background:var(--orange);transition:transform .25s}
.st-faq-list summary i::after{transform:rotate(90deg)}
.st-faq-list details[open] summary i::after{transform:rotate(0)}
.st-faq-list .a{display:flex;align-items:baseline;gap:14px;padding:0 8px 24px}
.st-faq-list .a .q{color:var(--brown)}
.st-faq-list .a p{margin:0;font-size:14px;letter-spacing:.04em;line-height:2;color:#4A4038}

/* footer */
.st-ft{border-top:1px solid var(--line);padding-top:56px}
.st-ft-in{display:flex;justify-content:space-between;gap:48px;align-items:flex-start}
.st-ft-brand{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.st-ft-brand img{width:180px;height:auto}
.st-ft-lead{margin:8px 0 0;font-size:13px;letter-spacing:.12em;color:var(--mute)}
.st-ft-nav{display:flex;flex-direction:column;gap:10px;align-items:flex-end;padding-top:6px}
.st-ft-nav a{font-size:13.5px;letter-spacing:.1em}
.st-ft-nav a:hover{color:var(--orange-d)}
.st-ft-bot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;margin-top:48px;padding-block:22px max(22px,env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);font-size:12px;letter-spacing:.08em;color:var(--mute)}
.st-ft-bot span[lang=en]{font-family:var(--en);font-style:italic;font-size:14px}

/* tablet */
@media (max-width:1040px){
  .st-nav{gap:18px}
  .st-nav a .ic{display:none}
  .st-steps{grid-template-columns:minmax(0,1fr);gap:28px;max-width:560px;margin:0 auto}
  .st-steps li:not(:last-child)::after{right:auto;left:22%;top:auto;bottom:-20px;transform:rotate(135deg)}
  .st-prizes{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* phone */
@media (max-width:760px){
  .st-hd-in{min-height:64px;gap:12px}
  .st-logo img{width:118px}
  .st-nav{display:none}
  .st-btn.sm{min-height:40px;padding:0 16px;font-size:12.5px;letter-spacing:.08em}
  .st-hero{flex-direction:column;align-items:stretch;min-height:0}
  .st-hero-pic{position:relative;inset:auto;width:100%;aspect-ratio:4/3}
  .st-hero-pic img{object-position:78% center;-webkit-mask-image:linear-gradient(180deg,#000 70%,transparent 100%);mask-image:linear-gradient(180deg,#000 70%,transparent 100%)}
  .st-hero-in{padding-block:8px 48px}
  .st-hero h1{font-size:30px;margin-bottom:20px}
  .st-lead{font-size:14px}
  .st-script{font-size:22px;margin-top:20px;white-space:nowrap}
  .st-feat ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 0;padding:28px 0}
  .st-feat li{padding:0 8px;font-size:12.5px}
  .st-feat li + li{border-left:0}
  .st-feat li:nth-child(2n){border-left:1px solid var(--line)}
  .st-feat li:last-child:nth-child(odd){grid-column:1/-1}
  .st-sec{padding-top:64px}
  .st-h2{gap:16px;margin-bottom:32px}
  .st-h2::before,.st-h2::after{width:32px}
  .st-steps li{grid-template-columns:minmax(0,4fr) minmax(0,6fr);gap:14px}
  .st-steps h3{font-size:16px}
  .st-prizes{grid-template-columns:minmax(0,1fr);gap:18px}
  .st-fan{aspect-ratio:auto;flex-direction:column;align-items:stretch;border-radius:10px 10px 0 0}
  .st-fan-pic{position:relative;inset:auto;width:100%;aspect-ratio:2/1}
  .st-fan-pic img{object-position:82% center;-webkit-mask-image:linear-gradient(180deg,#000 60%,transparent 100%);mask-image:linear-gradient(180deg,#000 60%,transparent 100%)}
  .st-fan-txt{padding:4px 24px 28px}
  .st-fan h2{font-size:21px}
  .st-fan li{font-size:14px}
  .st-req{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;gap:16px;padding:28px 22px}
  .st-req h2{font-size:22px}
  .st-req .st-btn{width:100%}
  .st-faq-list summary{font-size:14.5px;padding:18px 4px}
  .st-ft-in{flex-direction:column;gap:32px;align-items:center;text-align:center}
  .st-ft-brand{align-items:center}
  .st-ft-nav{align-items:center}
  .st-ft-bot{flex-direction:column;justify-content:center}
}