/* Emerald Season 2 concept. Visual layer only; existing form and music contracts retained. */
:root{--ink:#173e33;--paper:#f6f2e9;--muted:#657369;--gold:#d5b575;--serif:'Noto Serif Thai','Noto Sans Thai',serif}
body.emerald-page{background:radial-gradient(ellipse at 0 38%,#e8e7d854,transparent 38%),var(--paper);padding-bottom:90px}
.wrap{max-width:1320px;width:calc(100% - 80px)}
.preview-banner{background:#173e33;color:#ead6a9;font-size:10px;letter-spacing:.1em;padding:5px 16px}.preview-banner span{margin:0 10px}
.header{background:#faf7efed;border-color:#d8cdaf66;box-shadow:0 3px 22px #172e2210;backdrop-filter:blur(18px)}
.nav-wrap{max-width:1440px;padding:18px 40px;gap:24px}.brand{font-size:19px;letter-spacing:.07em}.brand small{color:#9b7842;font-size:9px;letter-spacing:.19em}.brand-icon{border-radius:50% 50% 50% 12%;box-shadow:0 4px 12px #173e3318}
nav{gap:23px}nav a{font-size:12px}nav a[aria-current]{border-color:#ba9654}.button{border-radius:50px}.nav-wrap>.button{border-radius:50px}.menu-toggle{display:none}
.emerald-hero{position:relative;isolation:isolate;overflow:hidden;background:#12382d;color:#fff;scroll-margin-top:80px}
.hero-landscape{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,#0d312ad9 0%,#103b2c55 43%,transparent 73%),url('assets/emerald-coast.webp') center center/cover no-repeat}
.hero-inner{height:510px;position:relative;display:flex;align-items:center}
.emerald-hero-copy{position:relative;z-index:3;width:52%;padding:22px 0}.emerald-hero-copy .eyebrow{font-size:10px;letter-spacing:.2em;color:#dad7b9;margin-bottom:15px}
.emerald-hero h1{font-family:var(--serif);font-size:clamp(55px,5.8vw,84px);font-weight:600;line-height:1.35;letter-spacing:-.055em;margin:0 0 8px;text-shadow:0 4px 25px #071c1b44}.emerald-hero h1>span{color:#f1d393;font-size:1.14em}
.hero-motto{color:#ecd195;letter-spacing:.12em;font-size:22px;margin:12px 0 16px}.hero-description{color:#e5e9d9;font-size:14px;line-height:1.9;margin:0 0 25px}
.emerald-hero-actions{display:flex;gap:14px;flex-wrap:wrap}.sun-button{background:linear-gradient(125deg,#ec9644,#ce501f);border:1px solid #f4bd8299;box-shadow:0 10px 23px #001d1a40,inset 0 1px #ffffff50;color:white}.sun-button:hover{background:linear-gradient(125deg,#f1aa55,#dc612b)}.glass-button{background:#123c3270;border:1px solid #e0c68d;color:white;backdrop-filter:blur(6px)}.glass-button:hover{background:#235643b0}
.hero-rimmi{position:absolute;z-index:2;right:12%;top:0;width:45%;height:100%;pointer-events:none;overflow:hidden}.hero-rimmi img{position:absolute;top:-70px;left:50%;transform:translateX(-50%);width:690px;max-width:none;height:auto;filter:drop-shadow(8px 12px 25px #031d2155)}.hero-phone-message{position:absolute;left:calc(50% - 198px);top:233px;width:72px;height:134px;border-radius:11px;background:linear-gradient(158deg,#123c36 0%,#1b6151 45%,#ead28d 165%);box-shadow:inset 0 0 0 1px #dbf4de22,inset 0 14px 25px #ffffff12,0 0 18px #f3d68730;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;text-align:center;color:#fffdf2;font-family:var(--font);overflow:hidden}.hero-phone-message::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 50% 18%,#f8e3a855 0 18%,transparent 37%),linear-gradient(120deg,transparent 0 45%,#ffffff30 46%,transparent 55%);opacity:.9}.hero-phone-message::after{content:'';position:absolute;left:50%;bottom:13px;width:22px;height:1px;border-radius:999px;background:#f8e7bb88;transform:translateX(-50%)}.hero-phone-message span,.hero-phone-message strong,.hero-phone-message small{position:relative;z-index:1}.hero-phone-message span{font-size:6px;font-weight:900;letter-spacing:.08em;color:#f5dc9f;text-shadow:0 2px 8px #021b1688}.hero-phone-message strong{font-family:var(--serif);font-size:11px;font-weight:700;line-height:1.32;text-shadow:0 2px 8px #061f1a99}.hero-phone-message small{font-size:7px;font-weight:700;color:#dff2dc}
.hero-orbit{position:absolute;z-index:-1;left:51%;top:-27%;width:730px;height:730px;border-radius:50%;border-left:3px solid #eaca88;border-top:1px solid #ead39d99;transform:rotate(-22deg);box-shadow:-13px -2px 45px -30px #ffe6a4;pointer-events:none}
.hero-signature{position:absolute;right:0;top:35%;color:#173c2f;text-align:center;width:170px;transform:rotate(-5deg);text-shadow:0 1px 12px #ffffdfd0}.hero-signature p{font-family:var(--serif);font-size:19px;line-height:1.9;margin:0}.hero-signature span{font-size:13px}.hero-caption{position:absolute;right:0;bottom:29px;color:#f1dfb1;font-size:8px;letter-spacing:.24em}
.quick-links{position:relative;z-index:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:-1px;padding:22px 0 26px}.quick-links>a{display:flex;align-items:center;gap:17px;padding:20px 23px;border-radius:17px;border:1px solid #fff;background:linear-gradient(145deg,#fffefa,#f4efe4);box-shadow:0 8px 21px #463c2610,inset 0 1px #fff;text-decoration:none;transition:transform .2s,box-shadow .2s}.quick-links>a:hover{transform:translateY(-4px);box-shadow:0 13px 24px #173e3318}.quick-icon{display:grid;place-items:center;flex:none;width:53px;height:53px;border-radius:50%;font-size:31px;background:linear-gradient(130deg,#28634d,#10382f);color:#f2e3bc;box-shadow:inset 0 1px #ffffff30}.quick-links strong{font-size:18px;display:block}.quick-links small{font-size:11px;color:var(--muted)}.quick-arrow{margin-left:auto;display:grid;place-items:center;background:#eee7d6;border-radius:50%;width:30px;height:30px;flex:none}
.community-section{display:grid;grid-template-columns:minmax(0,2.1fr) minmax(290px,1fr);gap:20px;align-items:stretch;margin-bottom:42px;scroll-margin-top:110px}.community-card{background:#fffdf8;border:1px solid #fff;border-radius:21px;padding:24px;box-shadow:0 10px 30px #52472a0c;display:grid;grid-template-columns:.75fr 1.6fr;gap:23px;min-width:0}.community-intro{padding:10px 0;align-self:center}.community-intro .eyebrow{color:#9b7949;font-size:9px;letter-spacing:.17em}.community-intro h2{font-family:var(--serif);font-size:29px;line-height:1.6;font-weight:600}.community-intro>p:not(.eyebrow){font-size:12px;color:var(--muted);line-height:1.95}.gold-rule{display:block;width:44px;height:3px;background:#c9a365;margin:25px 0}.community-intro small{font-size:10px;color:#9a7948}.community-intro .gallery-hint{font-size:10px;margin-top:10px}
.community-card .hero-art.wellness-art{transform:none;width:100%;max-width:none;padding:0;border:0;border-radius:0;background:none;box-shadow:none;margin:0;align-self:center;justify-self:stretch;min-width:0;overflow:visible}
.community-card .participant-carousel-viewport{border-radius:12px;background:transparent}.community-card .participant-collage{aspect-ratio:1.06;height:auto;border-radius:0;gap:6px;background:transparent;grid-template-rows:repeat(3,minmax(0,1fr));grid-template-areas:none}.community-card .participant-photo{grid-area:auto;border-radius:9px;background:#e4e8de}.community-card .participant-photo img{object-fit:cover;transform:none}.community-card .participant-photo button{width:100%;height:100%;display:block;border:0;padding:0;background:none;cursor:zoom-in}.community-card .participant-photo button:focus-visible{outline:3px solid #d78736;outline-offset:-3px}.community-card .participant-photo:hover img{transform:scale(1.04)}
.community-card .participant-carousel-controls{color:var(--ink);grid-template-columns:38px auto 1fr 38px;padding:15px 0 0}.community-card .participant-carousel-arrow{color:var(--ink);background:#eee9dc;border:0;width:38px;height:38px}.community-card .participant-carousel-arrow:hover{background:#e4d3ad}.community-card .participant-carousel-status,.community-card .participant-carousel-status strong{color:var(--ink)}.community-card .participant-carousel-dots button{background:#cccfc2;width:10px;height:10px;position:relative}.community-card .participant-carousel-dots button::after{content:'';position:absolute;inset:-12px -3px}.community-card .participant-carousel-dots button.is-active{background:#2e6652;width:24px}
.community-side{display:grid;grid-template-rows:1fr 1.2fr;gap:16px}.round-preview,.award-preview{position:relative;overflow:hidden;border-radius:20px;padding:25px;background:linear-gradient(125deg,#fffdf8,#ece6d7);border:1px solid #fff;box-shadow:0 8px 20px #52472a0c}.community-side .eyebrow{font-size:8px;letter-spacing:.16em;color:#987244;margin-bottom:12px}.community-side h2{font-size:21px;line-height:1.5;margin-bottom:16px}.processing-line{display:flex;gap:14px;align-items:center;margin-bottom:18px}.processing-line p{font-size:11px;line-height:1.8;color:var(--muted);margin:4px 0}.processing-line strong{font-size:14px}.progress-ring{display:block;width:35px;height:35px;border:5px solid #d3dccd;border-right-color:#2e6851;border-top-color:#2e6851;border-radius:50%;flex:none}.round-preview>.text-link{font-size:11px}.award-preview{background:radial-gradient(ellipse at 85% 10%,#2c664b,#12382e 80%);color:#fff;min-height:245px}.award-preview .eyebrow{color:#e9ce92}.award-preview h2{font-family:var(--serif);color:#edd398;font-size:27px;position:relative;z-index:1}.award-preview>p:not(.eyebrow){color:#d3dfca;font-size:11px;position:relative;z-index:1}.gold-button{background:linear-gradient(130deg,#e3c58b,#ab844a);border-color:#e3cb8d;color:#17392b;font-size:11px;padding:10px 15px;position:relative;z-index:2;gap:12px}.gold-button:hover{background:#e4c78b}.trophy-art{position:absolute;width:142px;height:215px;right:-10px;bottom:-10px;transform:rotate(9deg);filter:drop-shadow(0 8px 12px #001e1a99)}
.status-strip{margin-bottom:50px;background:transparent;border:0;border-block:1px solid #d9d0b9;border-radius:0;box-shadow:none;padding:22px 0}.strip-number{color:#ab8550}.status-strip>div{border-color:#ded4bf}.status-pill{background:#e4e9da}
.start-point{background:#fffcf6;border:1px solid #fff;box-shadow:0 10px 35px #67532a0b;border-radius:22px}.start-point h2{font-family:var(--serif);font-size:31px}.round-two-processing{background:#eef1e6}.start-point-status{background:#f0eadb;color:#896d44}
.photo-upload-callout{background:radial-gradient(ellipse at 100% 10%,#38624a,#133b31 65%);box-shadow:0 22px 40px #143c3115;grid-template-columns:1fr 1.2fr;gap:20px;position:relative;padding:42px}.photo-upload-copy h2{font-family:var(--serif);font-size:32px}.photo-upload-copy .button{border-radius:50px}.review-guide{display:grid;grid-template-columns:170px minmax(0,1fr);gap:8px;align-items:center}.review-guide>img{width:220px;height:350px;object-fit:contain;margin-left:-28px;filter:drop-shadow(5px 12px 13px #05271c66)}.approval-flow li{padding:16px;grid-template-columns:35px 1fr;gap:12px}.approval-flow li>span{width:32px;height:32px;background:#e2c287}.approval-flow strong{font-size:12px}.approval-flow small{font-size:10px}
.leaders{padding-bottom:55px}.leaders-copy h2,.submit-copy h2,.awards h2,.journey h2,.archive-callout h2{font-family:var(--serif);font-weight:600}.leaders-copy .eyebrow{color:#ad8952}.leader-photos a{box-shadow:0 12px 25px #6f5c361a}
.submit-section{background:linear-gradient(120deg,#e7ebdf,#f4efe2);border-color:#d9d4bf}.submit-grid{gap:64px}.form-card{border-radius:24px;box-shadow:0 6px 0 #dcd8c7,0 20px 45px #3d553015}.form-icon{border-radius:50%;background:#f3e6ca;color:#a27a3c}.fair-note{background:#fffaf0b0}.accent{color:#b7793a}.awards{padding-top:65px}.award-grid{gap:18px}.award{border-radius:18px;background:linear-gradient(145deg,#fffdf7,#f0ebdf);border-color:#e6ddc9;border-bottom-color:#d6c7a7}.award-symbol{color:#b28a47}.award.featured{background:radial-gradient(ellipse at 80% 10%,#35614b,#153c31);border-color:#225440}.timeline li{border-color:#ded3bb}.timeline li::before{background:#b99052}.archive-callout{background:linear-gradient(120deg,#e7e6d7,#f1eddf);border-color:#e0d9c5}.footer{padding-bottom:30px;border-color:#ddd3bd}.footer .brand{letter-spacing:.12em}.ss2-visitor-counter{color:#6d7768}
.ss2-music-player{left:auto;right:20px;width:390px;min-height:65px;grid-template-columns:44px minmax(0,1fr) auto;padding:8px 12px;border-radius:18px;box-shadow:0 8px 35px #1d38252b;border-color:#e2d4b6;background:#fffaf0ed}.ss2-music-cover-link{width:44px;height:44px;border-radius:11px}.ss2-music-label{font-size:8px;letter-spacing:.1em;color:#987b46}.ss2-music-title{font-size:12px}.ss2-music-status{font-size:9px}.ss2-music-progress{height:2px;margin-top:4px}.ss2-music-main{padding:0 10px}.ss2-music-controls button{width:32px;height:38px}.ss2-music-controls .ss2-music-toggle{width:36px;height:36px}.ss2-music-controls button:focus-visible{outline:2px solid #a57b37;outline-offset:2px}
.photo-lightbox{border:0;border-radius:18px;padding:14px;background:#0b251f;color:#fff;max-width:95vw;width:1000px;box-shadow:0 25px 90px #0005}.photo-lightbox::backdrop{background:#061b16e8;backdrop-filter:blur(7px)}.photo-lightbox img{display:block;width:100%;height:75vh;object-fit:contain}.lightbox-bar{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:10px 5px 0}.lightbox-bar p{margin:0;font-size:12px;color:#d8e2d7}.lightbox-close{border:1px solid #c6d5be77;border-radius:50px;color:#fff;background:#234c3e;padding:8px 20px;font:inherit;font-size:13px}
@media(min-width:1600px){.hero-inner{height:580px}.hero-rimmi img{width:770px;top:-70px}.hero-phone-message{left:calc(50% - 220px);top:268px;width:80px;height:150px;border-radius:13px}.hero-phone-message strong{font-size:12px}.emerald-hero h1{font-size:90px}}
@media(max-width:1150px){.wrap{width:calc(100% - 48px)}.nav-wrap{padding:15px 24px;gap:15px}nav{gap:16px}nav a{font-size:11px}.brand{font-size:16px}.nav-wrap>.button{display:none}.hero-inner{height:470px}.hero-rimmi{right:3%;width:51%}.hero-rimmi img{width:650px}.hero-phone-message{left:calc(50% - 187px);top:216px;width:68px;height:127px}.hero-signature{display:none}.hero-caption{right:15px}.community-card{grid-template-columns:1fr;padding:20px;gap:16px}.community-intro{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:0;flex-wrap:wrap}.community-intro .eyebrow{width:100%;margin:0}.community-intro h2{font-size:27px;margin:0}.community-intro h2 br{display:none}.community-intro>p:not(.gallery-hint),.community-intro .gold-rule,.community-intro small{display:none}.community-intro .gallery-hint{margin:0}.community-card .participant-collage{aspect-ratio:1.2}.community-section{grid-template-columns:1.65fr 1fr}.quick-links>a{padding:18px 16px;gap:10px}.quick-links strong{font-size:15px}.quick-icon{width:44px;height:44px;font-size:25px}.quick-links small{font-size:10px}.review-guide{grid-template-columns:110px 1fr}.review-guide>img{width:170px;margin-left:-30px}.photo-upload-callout{padding:30px}.photo-upload-copy h2{font-size:28px}}
@media(max-width:760px){
  html{scroll-padding-top:90px}.wrap{width:calc(100% - 32px)}.nav-wrap{padding:15px 18px;flex-wrap:nowrap;gap:12px}.brand{font-size:17px}.brand small{font-size:8px}.brand-icon{width:34px;height:34px;font-size:23px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;border:0;background:transparent;margin-left:auto;color:var(--ink)}.menu-toggle span{width:23px;height:2px;background:currentColor;border-radius:2px}.header nav{display:none;position:absolute;top:100%;left:0;right:0;background:#faf7ef;border-bottom:1px solid #d5c9ad;padding:15px 24px;box-shadow:0 14px 20px #112c2115;flex-wrap:wrap;gap:7px 22px}.header nav.is-open{display:flex}.header nav a,.header nav a[href="submit-photos/"]{display:block;font-size:13px;padding:12px 0;min-width:26%}.preview-banner{font-size:8px;padding:4px 10px}
  .hero-inner{height:510px;width:calc(100% - 36px);align-items:flex-start}.hero-landscape{background-position:68% center;background-image:linear-gradient(90deg,#0b342be8,#103a2f66 52%,#133b3222),url('assets/emerald-coast.webp')}.emerald-hero-copy{width:69%;padding-top:33px}.emerald-hero-copy .eyebrow{font-size:8px;letter-spacing:.11em;max-width:170px;line-height:1.8;margin-bottom:13px}.emerald-hero h1{font-size:clamp(39px,8.7vw,61px);line-height:1.5;letter-spacing:-.045em}.hero-motto{font-size:16px;letter-spacing:.06em;margin:10px 0 12px}.hero-description{font-size:11px;line-height:1.9;max-width:180px;margin:0 0 22px}.emerald-hero-actions{flex-direction:column;align-items:flex-start;gap:11px}.emerald-hero-actions .button{padding:11px 17px;font-size:12px;gap:18px;min-width:155px;min-height:44px}.hero-rimmi{right:-77px;top:113px;width:340px;height:calc(100% - 113px)}.hero-rimmi img{width:470px;top:-43px}.hero-phone-message{left:calc(50% - 135px);top:166px;width:48px;height:91px;border-radius:8px;gap:3px}.hero-phone-message span{font-size:4px}.hero-phone-message strong{font-size:7.7px;line-height:1.28}.hero-phone-message small{font-size:5.4px}.hero-phone-message::after{bottom:8px;width:14px}.hero-orbit{left:44%;top:18%;width:500px;height:500px;border-width:2px}.hero-caption{display:none}
  .quick-links{width:100%;padding:18px 16px 22px;margin-top:0;gap:8px;border-radius:26px 26px 0 0;background:var(--paper);margin-top:-16px}.quick-links>a{padding:14px 6px;display:flex;flex-direction:column;gap:10px;border-radius:15px;text-align:center;min-width:0}.quick-icon{width:39px;height:39px;font-size:23px;border-radius:12px}.quick-links strong{font-size:12px;white-space:nowrap}.quick-links small{display:none}.quick-arrow{margin:auto 0 0;width:27px;height:27px;font-size:12px}
  .community-section{display:flex;flex-direction:column;gap:20px;margin-bottom:27px}.community-card{background:none;border:0;box-shadow:none;padding:4px 0 0;gap:17px}.community-intro h2{font-size:25px;line-height:1.6}.community-intro .eyebrow{font-size:8px}.community-intro .gallery-hint{font-size:9px}.community-card .participant-collage{aspect-ratio:.9;gap:6px}.community-card .participant-photo{border-radius:9px}.community-card .participant-carousel-controls{padding:12px 0 0}.community-side{grid-template-columns:1fr;grid-template-rows:auto auto;gap:16px}.round-preview{padding:24px}.community-side h2{font-size:23px}.round-preview .eyebrow{margin-bottom:8px}.processing-line{margin-bottom:12px}.award-preview{padding:25px;min-height:245px}.award-preview h2{font-size:28px}.award-preview h2 br{display:none}.award-preview>p:not(.eyebrow){font-size:13px;max-width:65%}.trophy-art{right:6px;bottom:-7px;width:150px;height:217px}.gold-button{font-size:12px}
  .status-strip{margin-bottom:30px}.start-point{padding:25px 20px;border-radius:20px}.start-point h2{font-size:25px}.start-point-heading>div>p{font-size:13px}.start-point-link{font-size:12px}.photo-upload-callout{grid-template-columns:1fr;gap:12px;padding:25px 20px;margin-block:30px}.photo-upload-copy h2{font-size:28px}.photo-upload-copy>p:not(.eyebrow){font-size:12px}.review-guide{grid-template-columns:95px minmax(0,1fr);gap:0}.review-guide>img{width:145px;height:295px;margin-left:-27px}.approval-flow li{grid-template-columns:26px 1fr;padding:12px 10px;gap:9px}.approval-flow li>span{width:25px;height:25px;font-size:9px}.approval-flow strong{font-size:11px}.approval-flow small{font-size:9px}.leaders{padding-block:22px 35px}.leaders-copy h2{font-size:27px}.submit-grid{gap:30px}.submit-copy h2{font-size:29px}.form-card{padding:22px 14px}.awards{padding-top:40px}.section-heading h2{font-size:29px}.award-grid{grid-template-columns:1fr}.award h3{font-size:18px}.footer{padding-bottom:28px}.footer .brand{font-size:12px}
  .ss2-music-player{left:10px;right:10px;bottom:10px;width:auto;min-height:60px;padding:8px 10px;grid-template-columns:38px minmax(0,1fr) auto;border-radius:16px}.ss2-music-cover-link{width:38px;height:38px}.ss2-music-label{font-size:7px}.ss2-music-title{font-size:11px}.ss2-music-status{font-size:8px}.ss2-music-main{padding:0 8px}.ss2-music-controls button{width:30px;height:38px}.ss2-music-controls .ss2-music-toggle{width:35px;height:35px}.photo-lightbox{padding:10px}.photo-lightbox img{height:70vh}.lightbox-bar p{font-size:10px}
}
@media(max-width:370px){.brand{font-size:15px}.hero-inner{height:500px}.hero-rimmi{right:-96px;top:127px}.hero-rimmi img{width:450px}.hero-phone-message{left:calc(50% - 129px);top:161px;width:46px;height:87px}.hero-phone-message strong{font-size:7.3px}.emerald-hero h1{font-size:36px}.emerald-hero-actions .button{min-width:140px;font-size:11px;padding:10px 13px}.quick-links strong{font-size:11px}.community-intro h2{font-size:22px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.quick-links>a,.participant-photo img{transition:none}}

/* ============================================================
   Fix — 18 Sep 2026 (local only, not deployed)
   1) mobile: hero CTA buttons no longer sit on top of the phone screen
   2) phone-screen text enlarged to the largest size each frame fits
   3) .hero-phone-message re-aligned to the real screen in
      assets/rimmi-phone-guide.webp (943x1667): screen = x 208-298, y 414-610.
      Overlay covers x 206-300 (w 95) / y 412-612 (h 201) in image pixels, i.e.
      the whole screen plus ~2px of the dark bezel, so no blue band is left.
      Every breakpoint below is computed as  image_px * (img width / 943),
      left = calc(50% - (imgWidth/2 - 206*s)), top = imgTop + 412*s.
   ============================================================ */

/* default desktop — img width 690px, top -70px  → s = 0.7317 */
.hero-phone-message{left:calc(50% - 194px);top:231px;width:70px;height:147px;border-radius:8px}
.hero-phone-message span{font-size:8.2px}
.hero-phone-message strong{font-size:12.6px;letter-spacing:-.01em}
.hero-phone-message small{font-size:9.5px}

/* wide desktop — img width 770px, top -70px → s = 0.8165 */
@media(min-width:1600px){
  .hero-phone-message{left:calc(50% - 217px);top:266px;width:78px;height:164px;border-radius:9px}
  .hero-phone-message span{font-size:9.2px}
  .hero-phone-message strong{font-size:14px}
  .hero-phone-message small{font-size:10.5px}
}

/* tablet — img width 650px, top -70px → s = 0.6893 */
@media(max-width:1150px){
  .hero-phone-message{left:calc(50% - 183px);top:214px;width:65px;height:139px;border-radius:8px}
  .hero-phone-message span{font-size:7.6px}
  .hero-phone-message strong{font-size:11.7px}
  .hero-phone-message small{font-size:8.8px}
}

/* mobile — img width 470px, top -43px → s = 0.4984 */
@media(max-width:760px){
  /* Task 1: give the CTA column its own band under the phone frame.
     Phone frame ends at 450px inside .hero-inner, so the buttons start below it
     and .hero-inner grows to keep everything inside the (overflow:hidden) hero. */
  .hero-inner{height:540px}
  .emerald-hero-actions{margin-top:92px}

  /* Task 2 option A (default): keep Rimmi at her current size,
     enlarge the screen text to the maximum the 47px frame fits. */
  .hero-phone-message{left:calc(50% - 132px);top:162px;width:47px;height:100px;border-radius:5px}
  .hero-phone-message span{font-size:5.8px;letter-spacing:.02em}
  .hero-phone-message strong{font-size:8.3px;line-height:1.28}
  .hero-phone-message small{font-size:6.2px}

  /* Task 2 option B (opt-in): add class "hero-rimmi-big" to <body>.
     Rimmi and her phone grow ~15% (img 470px -> 540px, s = 0.5726) so the screen
     text can be much larger. She is nudged up/left and the hero grows, so that
     nothing of her is cropped and the phone frame keeps option A's height. */
  .hero-rimmi-big .hero-rimmi{top:88px;right:-60px;height:calc(100% - 88px)}
  .hero-rimmi-big .hero-rimmi img{width:540px;top:-49px}
  .hero-rimmi-big .hero-inner{height:560px}
  .hero-rimmi-big .emerald-hero-actions{margin-top:106px}
  .hero-rimmi-big .hero-phone-message{left:calc(50% - 152px);top:187px;width:54px;height:115px;border-radius:6px}
  .hero-rimmi-big .hero-phone-message span{font-size:6.9px}
  .hero-rimmi-big .hero-phone-message strong{font-size:9.7px}
  .hero-rimmi-big .hero-phone-message small{font-size:7.3px}
}

/* small mobile — img width 450px, top -43px → s = 0.4772 */
@media(max-width:370px){
  .hero-inner{height:530px}
  /* the 36px h1 makes the copy shorter here, so the CTA band needs a little more offset */
  .emerald-hero-actions{margin-top:102px}
  .hero-rimmi-big .emerald-hero-actions{margin-top:116px}
  .hero-phone-message{left:calc(50% - 127px);top:154px;width:45px;height:96px;border-radius:5px}
  .hero-phone-message span{font-size:5.6px}
  .hero-phone-message strong{font-size:8px}
  .hero-phone-message small{font-size:6px}
}