/* Math Is Elemental: mobile-first, responsive, no fixed-width canvas */
:root{--black:#070707;--ink:#f4f2ef;--muted:#c4c1bd;--pink:#ffc0cb;--sizer:#aaaeb3;--blue:#216b94;--focus:#fbd291}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:32px}
body{margin:0;background:var(--black);color:var(--ink);font-family:Calibri,Carlito,"Segoe UI",Arial,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
button,input,textarea{font:inherit}
:focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;z-index:9;top:8px;left:8px;padding:12px 15px;background:#fff;color:#111;transform:translateY(-150%)}
.skip-link:focus{transform:none}
.site-header{background:#080808;position:relative;z-index:3}
.header-inner{width:100%;margin:0 auto;min-height:97px;padding:16px clamp(22px,4.7vw,68px);display:flex;justify-content:space-between;align-items:center;gap:18px}
.brand{text-decoration:none;color:#f6f6f6;font-weight:400;font-size:clamp(24px,2.9vw,42px);line-height:1.1;letter-spacing:-.02em}
.book-button{text-decoration:none;background:#216d98;color:#fff;border:2px solid #d8e4eb;border-radius:6px;font-size:clamp(15px,1.46vw,23px);white-space:nowrap;padding:14px 27px;line-height:1.4;transition:background-color .2s}
.book-button:hover,.book-button:focus-visible{background:#3185b3}
.hero{position:relative;width:100%;background:radial-gradient(ellipse at 50% 32%,#ec8c30,#9f4d21);line-height:0;isolation:isolate}
.hero-picture,.hero-art{display:block;width:100%}
.hero-art{height:auto}
/* The emblem is its own transparent image, scaled with the rock artwork. */
.emblem{position:absolute;z-index:2;left:2.55%;top:63.8%;width:23.7%;height:auto;max-width:none;filter:drop-shadow(0 2px 0 rgba(0,0,0,.16))}
.concepts{background:#050505;padding:84px 4.8% 105px 31.6%;min-height:285px}
.concepts-inner{margin:0 auto;max-width:1150px}
.concept-line,.sizers-first,.sizers-second{font-size:clamp(20px,1.98vw,28px);line-height:1.28;font-weight:400;letter-spacing:-.01em;margin:0}
.concept-line{white-space:nowrap}
.group-label{font-size:1.1em;font-weight:700;vertical-align:-.015em}
.couplers{color:var(--pink)}
.sizers{color:var(--sizer)}
.sizers-entry{display:table;margin-top:40px;max-width:100%}
.sizers-first{white-space:nowrap}
.sizers-second{text-align:right;margin-top:3px;white-space:nowrap}
.box-pair{display:inline-flex;align-items:baseline;gap:5px;margin-left:4px;vertical-align:baseline;transform:translateY(2px)}
.box-pair span{display:block;width:.89em;height:.89em;border:3px solid currentColor}
.pizza{display:inline-block;font-size:1.05em;margin-left:2px;vertical-align:-.025em}
.content-shell{width:min(100% - 76px,1100px);margin:0 auto}
.about{padding:115px 0 122px;border-top:1px solid #222;background:#0b0b0b}
.about-layout,.contact-layout{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:clamp(40px,8vw,140px)}
.eyebrow{color:#bebebe;font-size:12px;font-weight:700;letter-spacing:.19em;margin:0 0 21px}
h2{margin:0;color:#faf9f6;font-weight:500;letter-spacing:-.025em;font-size:clamp(30px,3.3vw,46px);line-height:1.12}
.about-copy{color:#d9d7d3;font-size:clamp(18px,1.5vw,21px);line-height:1.65}
.about-copy p{margin:0 0 26px}
.about-copy em{font-style:italic;color:#f2ece7}
.student-thanks{padding-top:28px;border-top:1px solid #292929}
.student-thanks strong{color:#fff;font-weight:600}
.about-actions{display:flex;align-items:center;gap:36px;flex-wrap:wrap;margin-top:36px}
.text-link{font-weight:600;color:#d1ae87;text-decoration:underline;text-decoration-color:#9a7956;text-underline-offset:5px}
.text-link:hover{color:white}
.contact-button{border:1px solid #777;color:#fff;text-decoration:none;padding:10px 25px;border-radius:5px;font-size:17px;transition:background-color .2s}
.contact-button:hover{background:#242424}
.contact{background:#101010;padding:106px 0 127px;border-top:1px solid #252525}
.contact-intro{font-size:20px;line-height:1.6;color:#bbb9b4;max-width:370px;margin:26px 0 0}
.contact-form{display:grid;gap:19px;max-width:530px;width:100%}
.form-row{display:grid;gap:7px}
.form-row label{font-size:15px;color:#e4e1de}
.form-row input,.form-row textarea{width:100%;padding:12px 15px;color:#fff;background:#181818;border:1px solid #555;border-radius:4px;outline-offset:3px}
.form-row input:focus,.form-row textarea:focus{border-color:#7eb1c9}
.form-row textarea{resize:vertical;min-height:130px}
.send-button{justify-self:start;background:var(--blue);color:white;border:1px solid #b9cfda;border-radius:5px;padding:12px 24px;cursor:pointer;font-weight:600;font-size:17px}
.send-button:hover{background:#3185b3}
.form-note{font-size:13px;color:#aba9a6;margin:0;line-height:1.6}
.site-footer{background:#070707;border-top:1px solid #242424;padding:32px 0;color:#96928e;font-size:14px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:25px}
.footer-inner>div{display:flex;gap:27px;flex-wrap:wrap}
.site-footer a{text-decoration:none}
.site-footer a:hover{text-decoration:underline;color:#fff}
@media (min-width:1700px){
  .hero{max-height:650px;overflow:visible}
  .hero-picture{max-height:650px;overflow:hidden}
  .hero-art{width:100%;height:650px;object-fit:cover;object-position:center 40%}
  .emblem{width:clamp(355px,22vw,440px);top:62%;left:3.5%}
  .concepts{padding-left:33%}
}
@media (max-width:1200px) and (min-width:741px){
  .concepts{padding-left:31%;padding-top:63px;min-height:250px}
  .concept-line,.sizers-first,.sizers-second{font-size:clamp(18px,2.05vw,26px)}
  .sizers-entry{margin-top:31px}
}
@media (max-width:880px) and (min-width:741px){
  .concepts{padding-left:30%;padding-top:42px;padding-bottom:75px}
  .concept-line,.sizers-first,.sizers-second{font-size:18px}
  .sizers-entry{margin-top:26px}
  .about-layout,.contact-layout{gap:35px}
}
@media (max-width:740px){
  .header-inner{min-height:75px;padding:12px 19px}
  .brand{font-size:clamp(19px,5.1vw,29px);letter-spacing:-.025em}
  .book-button{padding:10px 13px;border-width:1px;border-radius:5px;font-size:clamp(14px,3.65vw,17px)}
  .hero{line-height:0}
  .hero-art{width:100%;height:auto;aspect-ratio:710/501;object-fit:cover}
  .emblem{width:clamp(170px,45vw,230px);left:50%;top:auto;bottom:0;transform:translate(-50%,70%)}
  .concepts{padding:clamp(135px,32vw,178px) 24px 77px;min-height:0}
  .concepts-inner{max-width:520px}
  .concept-line,.sizers-first,.sizers-second{font-size:clamp(17.5px,4.7vw,21px);line-height:1.45;white-space:normal}
  .concept-line{max-width:100%}
  .group-label{font-size:1.1em}
  .sizers-entry{display:table;margin-top:25px;width:auto;max-width:100%}
  .sizers-first{white-space:normal}
  .sizers-second{white-space:normal;text-align:right;margin-top:6px}
  .box-pair{white-space:nowrap;gap:4px}
  .box-pair span{width:.8em;height:.8em;border-width:2px}
  .content-shell{width:min(100% - 46px,560px)}
  .about{padding:70px 0 78px}
  .about-layout,.contact-layout{display:block}
  .about-copy{margin-top:27px;font-size:18px}
  h2{font-size:clamp(29px,7.1vw,39px)}
  .about-actions{gap:22px}
  .contact{padding:72px 0 86px}
  .contact-intro{font-size:18px;margin-bottom:31px}
  .form-row input,.form-row textarea{font-size:16px}
  .footer-inner{display:block}
  .footer-inner>div{margin-top:18px;gap:20px}
}
@media (max-width:360px){.header-inner{padding:12px 14px;gap:7px}.brand{font-size:18px}.book-button{font-size:13px;padding:9px 11px}.concepts{padding-left:17px;padding-right:17px}.concept-line,.sizers-first,.sizers-second{font-size:16.5px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}