/* 
   atemic global css
   works with global.css and all styles.css in tools
 */
:root {--ink:#17181C;--paper:#FFFFFF;--panel:#F1F0EA;--spot:#E5007D;--spot-dark:#B8005F;--cyan:#00AEEF;--yellow:#FFD100;--slate:#5B5D66;--line:rgba(23,24,28,0.12);--line-soft:rgba(23,24,28,0.08);}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {margin:0;background:var(--paper);color:var(--ink);font-family:'Barlow',sans-serif;-webkit-font-smoothing:antialiased;}
a {color:inherit;}
:focus-visible {outline:2px solid var(--spot);outline-offset:3px;}
/* nav */
nav {position:sticky;top:0;z-index:50;background:rgba(255,255,255,0.9);backdrop-filter:blur(8px);border-bottom:1px solid var(--line-soft);}
.nav-inner {max-width:1180px;margin:0 auto;padding:22px 40px;display:flex;align-items:center;justify-content:space-between;}
.logo {display:flex;align-items:center;gap:10px;text-decoration:none;width:130px;}
.logo img.wordmark {height:36px;width:auto;}
.navlinks {display:flex;gap:32px;align-items:center;}
.navlinks a {text-decoration:none;font-family:'Barlow',monospace;font-size:12px;letter-spacing:0.1em;text-transform:uppercase;font-weight:600;color:var(--ink);padding-bottom:3px;border-bottom:2px solid transparent;transition:border-color .15s ease;}
.navlinks a:hover {border-color:var(--spot);}
.navlinks a.active {border-color:var(--spot);}
.nav-hidden {display:none;}
/* moble nav open*/
.hamburger {display:none;flex-direction:column;justify-content:center;gap:5px;width:36px;height:36px;background:none;border:none;cursor:pointer;padding:4px;z-index:60;}
.hamburger span {display:block;width:24px;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s ease, opacity .2s ease;transform-origin:center;}
.hamburger.open span:nth-child(1) {transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2) {opacity:0;}
.hamburger.open span:nth-child(3) {transform:translateY(-7px) rotate(-45deg);}
/* mobile nav */
.mobile-menu {display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(255,255,255,0.97);backdrop-filter:blur(12px);z-index:49;flex-direction:column;justify-content:center;align-items:center;gap:10px;opacity:0;pointer-events:none;transition:opacity .25s ease;}
.mobile-menu.open {opacity:1;pointer-events:all;}
.mobile-menu a {text-decoration:none;font-family:'Barlow',monospace;font-size:15px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;color:var(--ink);padding:14px 0;border-bottom:2px solid transparent;transition:border-color .15s ease, color .15s ease;}
.mobile-menu a:hover {border-color:var(--spot);color:var(--spot);}
.mobile-menu .mobile-hidden {display:none;}
/* buttons */
.btn {display:inline-flex;align-items:center;gap:10px;font-family:'Barlow',monospace;font-size:13px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;padding:16px 26px;border-radius:3px;border:none;cursor:pointer;transition:background .15s ease, transform .1s ease, opacity .15s ease;}
.btn:active {transform:scale(0.98);}
.btn svg {width:14px;height:14px;}
.btn-dark {background:var(--ink);color:#fff;}
.btn-dark:hover {background:var(--spot);}
.btn-spot {background:var(--spot);color:#fff;}
.btn-spot:hover {background:#ff2b93;}
.btn-outline {background:transparent;color:var(--slate);border:1px solid var(--line);}
.btn-outline:hover {background:var(--panel);}
.btn:disabled {opacity:0.6;cursor:default;}
/* footer */
footer {background:var(--ink);border-top:1px solid rgba(255,255,255,0.1);}
.footer-inner {max-width:1180px;margin:0 auto;padding:26px 40px 40px;display:flex;justify-content:space-between;align-items:center;}
.footer-inner .logo .wordmark {height:25px;width:auto;}
.footer-right {display:flex;align-items:center;gap:22px;}
.backtotop {display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border-radius:50%;border:1px solid rgba(255,255,255,0.18);transition:border-color .15s ease, transform .15s ease;}
.backtotop img {width:13px;height:auto;}
.backtotop:hover {border-color:rgba(255,255,255,0.4);transform:translateY(-2px);}
footer .copy {font-family:'Barlow',monospace;font-size:11px;color:rgba(255,255,255,0.4);letter-spacing:0.05em;}
/* all tools */
.tool-hero {padding:90px 40px 60px;max-width:1180px;margin:0 auto;background-size:contain;background-position:bottom right;background-repeat:no-repeat;}
.tool-hero-inner {max-width:640px;}
.tool-back {display:inline-block;font-family:'Barlow',monospace;font-size:12px;letter-spacing:0.08em;text-transform:uppercase;font-weight:600;color:var(--slate);text-decoration:none;margin-bottom:28px;transition:color .15s ease;}
.tool-back:hover {color:var(--spot);}
.tool-hero h1 {font-family:'Fraunces',serif;font-weight:300;font-size:clamp(34px,5vw,54px);line-height:1.05;letter-spacing:-0.01em;margin:0 0 20px;}
.tool-hero h1 em {font-style:italic;color:var(--spot);}
.tool-hero p {font-size:17px;line-height:1.6;color:var(--slate);max-width:52ch;margin:0;}
.tool-body {max-width:1180px;margin:0 auto;padding:0 40px 90px;}
.card {background:var(--paper);border:1px solid var(--line);border-radius:2px;padding:32px;}
.tool-footnote {font-family:'Barlow',sans-serif;font-size:13.5px;color:var(--slate);line-height:1.6;margin-top:32px;padding-top:24px;border-top:1px solid var(--line);}
.tool-footnote strong {color:var(--ink);}
/* contact */
.contact {background:var(--ink);color:#fff;padding:110px 0;}
.contact-inner {max-width:1180px;margin:0 auto;padding:0 40px;display:grid;grid-template-columns:0.9fr 1.1fr;gap:70px;}
.contact h2 {font-family:'Fraunces',serif;font-weight:300;font-size:clamp(34px,4.4vw,52px);line-height:1.05;margin:0 0 20px;color:#fff;}
.contact-inner > div:first-child p {color:rgba(255,255,255,0.65);font-size:16px;line-height:1.6;max-width:38ch;}
.field {margin-bottom:22px;}
.field label {display:block;font-family:'Barlow',monospace;font-size:11px;letter-spacing:0.1em;text-transform:uppercase;color:rgba(255,255,255,0.5);margin-bottom:8px;}
.field input, .field textarea, .field select {width:100%;background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.18);border-radius:2px;padding:13px 14px;color:#fff;font-family:'Barlow',sans-serif;font-size:15px;}
.field select {appearance:none;-webkit-appearance:none;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff99' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px;}
.field select option {background:#17181C;color:#fff;}
.field input:focus, .field textarea:focus, .field select:focus {outline:none;border-color:var(--spot);background:rgba(255,255,255,0.09);}
.form-error {display:none;color:#FF6B8B;font-size:13.5px;margin-top:14px;}
.form-error.show {display:block;}
.hp-field {position:absolute !important;left:-9999px !important;width:1px;height:1px;opacity:0;pointer-events:none;}
.row2 {display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.submit {display:inline-flex;align-items:center;gap:10px;background:var(--spot);color:#fff;border:none;font-family:'Barlow',monospace;font-size:13px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;padding:16px 26px;border-radius:3px;cursor:pointer;transition:background .15s ease;}
.submit:hover {background:#ff2b93;}
/* responsive */
@media (max-width:860px) {.navlinks {display:none;} .hamburger {display:flex;} .mobile-menu {display:flex;} .nav-inner {padding:18px 22px;} .footer-inner {padding:26px 22px 40px;} .contact {padding:70px 0;} .contact-inner {padding:0 22px;grid-template-columns:1fr;gap:40px;} .row2 {grid-template-columns:1fr;} .tool-hero {padding:70px 22px 40px;}}