/* Presentation shared only by the public Fun Run registration and ticket pages. */
.fr-page{--fr-ink:#29282c;--fr-muted:#64616a;--fr-red:#a72036;--fr-line:#e6e1df;background:#faf9f7;color:var(--fr-ink);font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:15px;line-height:1.65;text-rendering:optimizeLegibility}
.fr-page :is(button,input,select,textarea,.fr-button){font-family:inherit}
.fr-page :is(h1,h2,h3,p){overflow-wrap:break-word}
.fr-page :is(h1,h2,h3){text-wrap:balance}
.fr-page header.fr-topbar,.fr-page main{width:min(100% - 64px,1160px)}
.fr-page header.fr-topbar{margin-top:22px;padding:12px 0 22px;border:0;border-bottom:1px solid var(--fr-line);border-radius:0;background:transparent;box-shadow:none;gap:24px}
.fr-page .fr-brand{--ocl-identity-width:98px;--ocl-identity-mobile-width:76px;gap:16px}
.fr-page .fr-brand-copy{border-color:#ddd6d4;padding-left:16px;gap:4px}
.fr-page .fr-brand-copy strong{font-size:12px;font-weight:650;letter-spacing:.01em}
.fr-page .fr-brand-copy>span{font-size:11px;color:var(--fr-muted);letter-spacing:.03em}
.fr-page .fr-landing-nav{gap:26px}
.fr-page .fr-landing-nav>a{font-size:13px;font-weight:550}
.fr-page :is(button,.fr-button,a.fr-link-button){border-radius:8px;font-size:14px;font-weight:600;letter-spacing:.01em;min-height:48px}
.fr-page a.fr-link-button{padding:12px 22px;gap:20px}
.fr-page :is(.fr-link-secondary,.secondary){border-color:var(--fr-line);color:var(--fr-ink);background:white}
.fr-page :is(a.fr-link-secondary,.secondary):hover:not(:disabled){background:#f4f1ef;border-color:#d3c8c7}
.fr-page .fr-hero{grid-template-columns:1.15fr .85fr;gap:48px;margin-top:32px;padding:52px 56px;background:#f1ece8;border:1px solid #eae2dd;border-radius:18px;position:relative}
.fr-page .fr-hero h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(64px,7.3vw,96px);font-weight:400;letter-spacing:-.055em;line-height:1.02;margin:22px 0 24px;color:#3a282e}
.fr-page .fr-hero h1 span{display:block;font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:.49em;line-height:1.3;letter-spacing:-.045em;font-weight:500;color:var(--fr-red);margin-top:12px}
.fr-page .fr-eyebrow,.fr-page .fr-overline{font-size:10px;letter-spacing:.17em;font-weight:650;line-height:1.6;color:#8e3546}
.fr-page .fr-hero .fr-eyebrow{font-size:10px;letter-spacing:.16em;color:#7f4853}
.fr-page .fr-intro-copy{font-size:16px;line-height:1.75;max-width:320px;margin-bottom:22px;color:#625b60}
.fr-page .fr-hero-date{font-size:13px;line-height:1.9;font-weight:500;color:#514a50}
.fr-page .fr-hero-actions{gap:12px;margin:26px 0 22px}
.fr-page .fr-hero-status{font-size:13px;font-weight:600;margin-bottom:6px;color:#4d444b}
.fr-page .fr-hero-note{font-size:12px;max-width:340px;color:#69616a}
.fr-page .fr-hero .fr-poster{width:224px;border-radius:10px;border:6px solid white;box-shadow:0 16px 40px #4c303719}
.fr-page .fr-poster small{font-size:11px;font-weight:500;padding:10px 4px;color:#675b61}
.fr-page :is(.fr-benefits,.fr-route-section,.fr-registration){margin-top:68px}
.fr-page .fr-section-intro{margin-bottom:26px}
.fr-page .fr-section-intro h2,.fr-page .fr-benefits h2{font-size:clamp(26px,2.6vw,34px);font-weight:550;line-height:1.25;letter-spacing:-.04em;margin:8px 0 0}
.fr-page .fr-section-intro>p:not(.fr-eyebrow){font-size:14px;margin-top:10px}
.fr-page .fr-benefits{padding:0 0 40px;border-color:var(--fr-line);grid-template-columns:1fr 1.7fr}
.fr-page .fr-benefits li{font-size:13px;font-weight:550;gap:12px}
.fr-page .fr-benefits svg{color:#8f3446;background:#f0e7e6;border-radius:50%;width:24px;height:24px;padding:16px;stroke-width:1.4}
.fr-page .fr-route-grid{padding:30px;gap:36px;border-color:var(--fr-line);border-radius:16px;box-shadow:none}
.fr-page .fr-route-copy h3{font-size:23px;font-weight:550;letter-spacing:-.035em;line-height:1.35;margin:18px 0}
.fr-page .fr-route-copy dl>div{padding:12px 0;border-color:#eee9e6}
.fr-page .fr-route-copy dt{font-size:12px}.fr-page .fr-route-copy dd{font-size:15px;font-weight:500}
.fr-page .fr-route-badge{background:#f4eee7;color:#796047;font-size:11px;font-weight:600;border:1px solid #e9dfd4}
.fr-page .fr-route-disclaimer{background:#f7f4f0;color:#6c5d50;font-size:12px}
.fr-page .fr-layout{grid-template-columns:minmax(0,1fr) 270px;gap:32px}
.fr-page .fr-panel{padding:30px;margin:20px 0;border-color:var(--fr-line);border-radius:14px;box-shadow:none}
.fr-page .fr-section-heading{gap:14px;margin-bottom:26px;align-items:center}
.fr-page .fr-section-heading h2{font-size:21px;line-height:1.35;font-weight:600;letter-spacing:-.025em;margin-bottom:5px}
.fr-page .fr-section-heading p{font-size:13px;font-weight:400;color:var(--fr-muted)}
.fr-page .fr-section-number{width:36px;height:36px;border:0;border-radius:50%;background:#f4eded;color:#994257;font-size:11px;font-weight:600}
.fr-page .fr-grid{gap:22px 20px}
.fr-page label{font-size:13px;font-weight:550;letter-spacing:.005em;color:#403a41}
.fr-page input:not([type=checkbox]),.fr-page select{font-size:16px;font-weight:400;min-height:50px;padding:12px 14px;border-radius:8px;border-color:#dcd5d4;color:var(--fr-ink)}
.fr-page input::placeholder{font-size:14px;color:#78717a}
.fr-page .fr-field-help{font-size:12px}
.fr-page .fr-ticket-note{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 20px;padding:16px 20px;background:#f3efed;border-color:transparent}
.fr-page .fr-ticket-note p{margin:0;font-size:13px;color:#5a5159}
.fr-page .fr-ticket-note a{font-size:12px;font-weight:600;text-decoration:none;min-height:36px;display:inline-flex;align-items:center;gap:12px}
.fr-page .fr-form-nav{gap:4px;margin:18px 0}.fr-page .fr-form-nav a{font-size:12px;font-weight:500;gap:8px}.fr-page .fr-form-nav span{background:transparent;border-color:#d8d0d0}
.fr-page .fr-bank-card,.fr-page .fr-summary{background:#f8f5f3;border-color:var(--fr-line);border-radius:10px}
.fr-page .fr-bank-number{font-size:23px;font-weight:600;letter-spacing:.03em}
.fr-page .fr-payment-total>strong,.fr-page .fr-summary-total{font-size:28px;font-weight:600;letter-spacing:-.035em}
.fr-page .fr-batch-option.is-active{background:#fbf5f5;border-color:#d9b9bf}
.fr-page .fr-event-summary{background:#f1ece8;border:1px solid var(--fr-line);border-radius:14px;padding:24px;box-shadow:none}
.fr-page .fr-event-summary h2{font-size:20px;font-weight:550;letter-spacing:-.025em;line-height:1.4}
.fr-page .fr-event-copy p{font-size:13px;line-height:1.8}.fr-page .fr-event-copy #frAsideStatus{color:#8e3546}
.fr-page .fr-hint{font-size:12px}.fr-page .notice{font-size:13px;line-height:1.7}
.fr-page .notice:empty{display:none}
.fr-page .fr-footer{border-top:1px solid var(--fr-line);margin-top:52px;padding-top:28px;color:#645c65}
.fr-page .fr-footer span{color:#756c75;font-size:11px}
/* Ticket access and returned records use the same typography and spacing. */
.fr-page main.fr-ticket-main{width:min(100% - 48px,660px);padding-bottom:64px}
.fr-page .fr-ticket-main .fr-intro{padding:56px 0 16px}
.fr-page .fr-ticket-main h1{font-family:Georgia,"Times New Roman",serif;font-size:48px;font-weight:400;line-height:1.15;letter-spacing:-.045em;color:#3a282e;margin:14px 0 16px}
.fr-page .fr-ticket-main h1 span{color:var(--fr-red);font-weight:400}
.fr-page .fr-ticket-main .fr-intro>p:last-child{font-size:14px;color:var(--fr-muted);margin:0}
.fr-page .fr-ticket-main label{font-size:13px;gap:4px}
.fr-page #ticketCode{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:15px;letter-spacing:.025em;min-height:54px}
.fr-page #ticketCode::placeholder{font-size:12px;letter-spacing:0}
.fr-page .fr-ticket-main .fr-actions{display:grid;grid-template-columns:1fr auto;gap:12px;margin-top:22px}
.fr-page .fr-ticket-main summary{font-size:14px;font-weight:600;padding:2px 0;min-height:44px}
.fr-page .fr-ticket-main details.fr-panel{background:transparent;border-color:var(--fr-line);padding:16px 24px}
.fr-page .fr-ticket-main details[open]{background:white}
.fr-page .fr-history-card{display:grid;gap:12px;padding:28px!important;border-color:var(--fr-line)!important;border-radius:14px!important}
.fr-page .fr-history-card .history-card-header{padding:0 0 16px;width:100%;border-bottom:1px solid var(--fr-line);gap:12px;display:flex;align-items:flex-start;flex-wrap:wrap}
.fr-page .fr-history-card .history-card-header>div{flex:1;min-width:160px}
.fr-page .history-card-sport{font-size:11px;color:var(--fr-muted);letter-spacing:.02em}
.fr-page .fr-history-card h3{font-size:21px;line-height:1.4;font-weight:600;letter-spacing:-.025em;margin:8px 0 0;overflow-wrap:anywhere}
.fr-page .fr-history-card p{font-size:14px;line-height:1.7}
.fr-page .fr-history-card small{font-size:11px;color:var(--fr-muted)}
.fr-page .fr-history-card .fr-history-status{font-size:11px;padding:6px 10px;background:#f3eeed;color:#674c56;white-space:normal}
.fr-page .fr-group-panel{background:#f4f8f5;border-color:#d7e3db;padding:20px;border-radius:10px}
.fr-page .fr-group-panel h3{font-size:18px;font-weight:600;margin:0}
.fr-page .fr-group-panel p{font-size:13px}
@media(max-width:1000px){.fr-page .fr-hero{gap:30px;padding:40px 36px}.fr-page .fr-benefits{grid-template-columns:1fr;gap:28px}.fr-page .fr-layout{grid-template-columns:minmax(0,1fr) 240px;gap:24px}.fr-page .fr-event-summary{padding:20px}.fr-page .fr-panel{padding:24px}}
@media(max-width:760px){
 .fr-page header.fr-topbar,.fr-page main{width:calc(100% - 36px)}
 .fr-page header.fr-topbar{margin-top:12px;padding:6px 0 16px;gap:10px;flex-wrap:nowrap}
 .fr-page .fr-brand{gap:0;flex:none}.fr-page .fr-brand-copy{display:none}
 .fr-page .fr-landing-nav{gap:16px}.fr-page .fr-landing-nav>a{font-size:12px}.fr-page .fr-landing-nav .fr-link-button{font-size:12px;min-height:44px;padding:10px 14px;gap:8px}
 .fr-page .fr-landing-nav>a[href="#fasilitas"]{display:none}
 .fr-page .fr-hero{grid-template-columns:1fr;padding:32px 26px;gap:32px;margin-top:22px;border-radius:14px}
 .fr-page .fr-hero h1{font-size:72px;margin:20px 0}.fr-page .fr-hero h1 span{font-size:35px;letter-spacing:-.04em;margin-top:8px}
 .fr-page .fr-hero .fr-eyebrow{font-size:9px;letter-spacing:.13em}.fr-page .fr-intro-copy{font-size:15px;max-width:270px;margin-bottom:18px}
 .fr-page .fr-hero-date{font-size:12px;line-height:1.85}.fr-page .fr-hero-date span{padding:0 2px}
 .fr-page .fr-hero-actions{gap:8px;margin:22px 0 18px}.fr-page .fr-hero-actions a{padding:12px 15px;gap:12px;font-size:13px}
 .fr-page .fr-hero-status{font-size:12px}.fr-page .fr-hero-note{font-size:11px;line-height:1.7}
 .fr-page .fr-hero-visual{padding:26px 0 0;border-top:1px solid #ded2cb}.fr-page .fr-hero .fr-poster{width:180px}
 .fr-page :is(.fr-benefits,.fr-route-section,.fr-registration){margin-top:46px}
 .fr-page .fr-benefits{padding-bottom:30px;gap:24px}.fr-page .fr-benefits ul{gap:6px}.fr-page .fr-benefits li{font-size:11px;gap:10px}.fr-page .fr-benefits svg{padding:12px;width:22px;height:22px}
 .fr-page .fr-section-intro{margin-bottom:22px}.fr-page .fr-section-intro h2{font-size:27px}.fr-page .fr-route-grid{padding:18px;gap:24px;grid-template-columns:1fr}.fr-page .fr-route-copy h3{font-size:22px}
 .fr-page .fr-layout{grid-template-columns:1fr;gap:0}.fr-page .fr-panel{padding:24px 20px}.fr-page .fr-ticket-note{padding:16px 18px;gap:4px}
 .fr-page .fr-section-heading{gap:12px;margin-bottom:24px}.fr-page .fr-section-heading h2{font-size:20px}.fr-page .fr-section-heading p{font-size:12px}
 .fr-page .fr-form-nav a{font-size:11px;gap:5px}.fr-page .fr-form-nav span{width:20px;height:20px;font-size:10px}
 .fr-page .fr-event-summary{padding:24px}.fr-page .fr-grid{column-gap:16px}
 .fr-page main.fr-ticket-main{width:calc(100% - 36px)}.fr-page .fr-ticket-main .fr-intro{padding:36px 0 10px}.fr-page .fr-ticket-main h1{font-size:40px}
 .fr-page .fr-ticket-main .fr-actions{grid-template-columns:1fr}.fr-page .fr-ticket-main .fr-actions button{width:100%}
 .fr-page .fr-history-card{padding:22px!important}.fr-page .fr-history-card h3{font-size:20px}
 .fr-page #ticketCode{font-size:13px;letter-spacing:0}.fr-page #ticketCode::placeholder{font-size:10px}
 .fr-page .fr-ticket-main details.fr-panel{padding:14px 20px}
}
@media(max-width:370px){.fr-page .fr-hero{padding:28px 20px}.fr-page .fr-hero h1{font-size:64px}.fr-page .fr-hero-actions a{padding:12px;font-size:12px}.fr-page .fr-landing-nav{gap:12px}}
@media(prefers-reduced-motion:reduce){.fr-page *{scroll-behavior:auto!important;transition:none!important}}
/* Phone readability: keep essential instructions legible without zooming. */
@media(max-width:760px){
 .fr-page label,.fr-page .fr-ticket-main label{font-size:14px}
 .fr-page .fr-hero .fr-eyebrow,.fr-page .fr-eyebrow,.fr-page .fr-overline{font-size:11px;letter-spacing:.1em}
 .fr-page .fr-hero-date,.fr-page .fr-hero-status,.fr-page .fr-hero-note{font-size:13px}
 .fr-page .fr-benefits li{font-size:13px}
 .fr-page .fr-section-heading p,.fr-page .fr-hint,.fr-page .fr-field-help,.fr-page #frProofHelp,.fr-page #frProofName,.fr-page #frProgramHelp,.fr-page .fr-payment-note,.fr-page .fr-transfer-help,.fr-page .fr-save-help{font-size:13px;line-height:1.7}
 .fr-page .fr-form-nav a{font-size:12px}
 .fr-page .fr-ticket-note a,.fr-page .fr-history-bottom,.fr-page .fr-proof-link{font-size:13px}
 .fr-page .fr-route-copy dt,.fr-page .fr-route-copy dd small,.fr-page .fr-route-disclaimer,.fr-page figcaption{font-size:13px}
 .fr-page .fr-route-copy dd{font-size:16px}
 .fr-page #ticketCode{font-size:16px;letter-spacing:0}
 .fr-page #ticketCode::placeholder{font-family:ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:14px}
 .fr-page .fr-history-card small,.fr-page .history-card-sport{font-size:12px;line-height:1.65}
 .fr-page .fr-history-card .fr-history-status,.fr-page .fr-group-panel small{font-size:12px}
 .fr-page .fr-group-panel p{font-size:14px}
 .fr-page .fr-group-panel{overflow-wrap:anywhere}
}
@media(max-width:370px){
 .fr-page .fr-payment-total{flex-direction:column;align-items:flex-start;gap:12px}
 .fr-page .fr-form-nav{flex-wrap:wrap;justify-content:flex-start}
 .fr-page .fr-form-nav a{flex:1 1 100px;justify-content:flex-start;padding-inline:8px}
 .fr-page .fr-benefits ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 12px}
 .fr-page .fr-hero-actions a{font-size:14px;width:100%}
}
