/* Contact Us — warm paper / ink, matches welcome.php and login.css */
:root,[data-theme="light"]{
  --paper:#f5f3ee; --card:#ffffff; --card2:#faf9f6; --ink:#15140f; --ink2:#55534b; --ink3:#8d8a80;
  --line:#e6e2d8; --line2:#d6d1c4; --accent:#ff4d1c; --accent-soft:#ffe9e2; --accent-ink:#fff;
  --red:#e5391a; --green:#1a9d5b; --amber:#c98a00;
  --shadow:0 1px 0 rgba(21,20,15,.04),0 30px 70px -30px rgba(21,20,15,.28);
  --serif:'Instrument Serif',Georgia,serif; --sans:'Manrope',system-ui,sans-serif; --mono:'JetBrains Mono',ui-monospace,Menlo,monospace;
}
[data-theme="dark"]{
  --paper:#0d0d0b; --card:#171714; --card2:#121210; --ink:#f3f1ea; --ink2:#a9a69b; --ink3:#6f6d64;
  --line:#272621; --line2:#37352e; --accent:#ff6a3d; --accent-soft:#2b1810; --accent-ink:#15100c;
  --red:#ff6a4d; --green:#48d187; --amber:#f0b429;
  --shadow:0 1px 0 rgba(255,255,255,.03),0 30px 80px -30px rgba(0,0,0,.9);
}
*,*::before,*::after{box-sizing:border-box}
html body{margin:0;padding-top:0!important;font-family:var(--sans)!important;background:var(--paper);color:var(--ink);min-height:100vh;
  -webkit-font-smoothing:antialiased;transition:background .3s,color .3s}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cu-glow{position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(40% 35% at 15% 8%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),
             radial-gradient(35% 35% at 92% 85%,color-mix(in srgb,#3fd0bb 12%,transparent),transparent 70%)}
.cu-wrap{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:6.5rem 1.5rem 4rem;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:3rem;align-items:start}

/* aside */
.cu-eyebrow{display:flex;align-items:center;gap:9px;margin:0 0 1rem;font:700 .66rem var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.cu-eyebrow i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px color-mix(in srgb,var(--green) 22%,transparent)}
.cu-aside h1{font:400 clamp(2.8rem,6vw,4.6rem)/.98 var(--serif);letter-spacing:-.025em;margin:0}
.cu-aside h1 em{font-style:italic;color:var(--accent)}
.cu-lead{margin:1.1rem 0 1.8rem;font-size:1rem;line-height:1.6;color:var(--ink2);max-width:44ch}
.cu-cards{display:flex;flex-direction:column;gap:.8rem}
.cu-card{display:flex;align-items:center;gap:14px;padding:1rem 1.1rem;border-radius:20px;background:var(--card);border:1px solid var(--line);transition:.25s}
a.cu-card:hover{background:var(--ink);color:var(--paper);border-color:var(--ink);transform:translateY(-3px)}
a.cu-card:hover small{color:color-mix(in srgb,var(--paper) 65%,transparent)}
.cu-ico{width:44px;height:44px;border-radius:14px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:.25s}
a.cu-card:hover .cu-ico{background:var(--accent);color:var(--accent-ink)}
.cu-card b{display:block;font-size:.9rem;font-weight:800}
.cu-card small{display:block;margin-top:2px;font-size:.78rem;color:var(--ink3);line-height:1.45;font-weight:500;word-break:break-word}
.cu-go{margin-left:auto;font-size:.72rem;color:var(--ink3)}

/* main card */
.cu-card-main{background:var(--card);border:1px solid var(--line);border-radius:32px;padding:2.2rem 2.2rem 1.8rem;box-shadow:var(--shadow);position:relative;animation:cuIn .7s cubic-bezier(.2,.8,.2,1) both}
@keyframes cuIn{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:none}}
.cu-card-main::before{content:'';position:absolute;left:2.2rem;top:-1px;width:64px;height:3px;background:var(--accent);border-radius:0 0 4px 4px;box-shadow:0 0 18px var(--accent)}
.cu-card-main h2{font:400 2.1rem/1.05 var(--serif);letter-spacing:-.02em;margin:0}
.cu-sub{margin:.45rem 0 1.4rem;font-size:.84rem;color:var(--ink2)}

.cu-alert{display:flex;align-items:center;gap:10px;padding:.8rem 1rem;border-radius:14px;margin-bottom:1rem;background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red);font-size:.84rem;font-weight:700}
.cu-hp{position:absolute;left:-9999px;top:-9999px;height:0;overflow:hidden}

/* topic pills */
.cu-topics{border:0;padding:0;margin:0 0 1.2rem;display:flex;flex-wrap:wrap;gap:8px}
.cu-topics legend{font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-bottom:9px;padding:0;float:left;width:100%}
.cu-topic{cursor:pointer}
.cu-topic input{position:absolute;opacity:0;pointer-events:none}
.cu-topic span{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border-radius:99px;border:1.5px solid var(--line2);font-size:.8rem;font-weight:700;color:var(--ink2);transition:.18s}
.cu-topic span i{color:var(--ink3);transition:.18s}
.cu-topic:hover span{border-color:var(--ink);color:var(--ink)}
.cu-topic input:checked + span{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.cu-topic input:checked + span i{color:var(--accent)}
.cu-topic input:focus-visible + span{outline:2px solid var(--accent);outline-offset:2px}

/* fields */
.cu-row{display:grid;grid-template-columns:1fr 1fr;gap:0 1rem}
.cu-field{margin-bottom:1rem}
.cu-field label{display:flex;justify-content:flex-start;align-items:center;font-size:.7rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ink3);margin-bottom:7px}
.cu-field label em{font-style:normal;color:var(--accent);margin-left:3px}
.cu-field input,.cu-field textarea{width:100%;background:var(--paper);border:1.5px solid var(--line);border-radius:16px;padding:.85rem 1.05rem;color:var(--ink);font:600 .93rem var(--sans);transition:.2s;resize:vertical}
.cu-field textarea{min-height:130px;line-height:1.55}
.cu-field input::placeholder,.cu-field textarea::placeholder{color:var(--ink3);font-weight:500}
.cu-field input:focus,.cu-field textarea:focus{outline:none;border-color:var(--ink);background:var(--card);box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 16%,transparent)}
.cu-field.ok input,.cu-field.ok textarea{border-color:color-mix(in srgb,var(--green) 70%,var(--line))}
.cu-field.bad input,.cu-field.bad textarea{border-color:var(--red)}
.cu-err{display:block;min-height:0;margin-top:5px;font-size:.74rem;font-weight:700;color:var(--red)}
.cu-err:empty{display:none}
.cu-count{margin-left:auto;font:500 .66rem var(--mono);letter-spacing:.06em;color:var(--ink3);text-transform:none}
.cu-count.warn{color:var(--amber)}

/* submit */
.cu-submit{position:relative;overflow:hidden;width:100%;margin-top:.4rem;padding:1rem 1.2rem;border:0;border-radius:99px;background:var(--ink);color:var(--paper);font:800 .95rem var(--sans);cursor:pointer;transition:transform .2s,box-shadow .25s,background .25s}
.cu-submit::before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.28) 50%,transparent 70%);transform:translateX(-120%);transition:transform .7s}
.cu-submit:hover:not(:disabled){background:var(--accent);color:var(--accent-ink);transform:translateY(-2px);box-shadow:0 18px 34px -14px var(--accent)}
.cu-submit:hover::before{transform:translateX(120%)}
.cu-btn-t i{margin-right:9px}
.cu-submit:disabled{opacity:.7;cursor:progress}
.cu-spin{display:none;width:18px;height:18px;border:2.5px solid currentColor;border-right-color:transparent;border-radius:50%;animation:cuSpin .7s linear infinite;margin:0 auto}
.cu-submit.loading .cu-btn-t{display:none}.cu-submit.loading .cu-spin{display:block}
@keyframes cuSpin{to{transform:rotate(360deg)}}
.cu-fine{margin:.9rem 0 0;text-align:center;font-size:.72rem;color:var(--ink3)}

/* success */
.cu-success{text-align:center;padding-top:2.6rem}
.cu-success::before{left:50%;transform:translateX(-50%)}
.cu-check{width:84px;height:84px;margin:0 auto 1.1rem}
.cu-check svg{width:100%;height:100%;fill:none;stroke-linecap:round;stroke-linejoin:round}
.cu-check circle{stroke:var(--green);stroke-width:2.5;stroke-dasharray:151;stroke-dashoffset:151;animation:cuDraw .8s .1s ease forwards}
.cu-check path{stroke:var(--green);stroke-width:3.5;stroke-dasharray:44;stroke-dashoffset:44;animation:cuDraw .5s .8s ease forwards}
@keyframes cuDraw{to{stroke-dashoffset:0}}
.cu-success p{margin:.8rem auto 0;max-width:40ch;font-size:.92rem;line-height:1.6;color:var(--ink2)}
.cu-success p b{color:var(--ink)}
.cu-note{padding:.7rem 1rem;border-radius:14px;background:var(--accent-soft);font-size:.8rem!important;color:var(--ink)!important}
.cu-ref{display:inline-flex;align-items:center;gap:12px;margin:1.4rem 0 1.3rem;padding:8px 8px 8px 18px;border-radius:99px;border:1px dashed var(--line2)}
.cu-ref span{font:700 .62rem var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--ink3)}
.cu-ref b{font:400 1.3rem var(--serif);background:var(--ink);color:var(--paper);padding:3px 16px;border-radius:99px}
.cu-actions{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}
.cu-btn{padding:.8rem 1.6rem;border-radius:99px;background:var(--ink);color:var(--paper);font-weight:800;font-size:.85rem;transition:.2s}
.cu-btn:hover{background:var(--accent);color:var(--accent-ink);transform:translateY(-2px)}
.cu-btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line2)}
.cu-btn.ghost:hover{background:var(--paper);border-color:var(--ink);color:var(--ink)}

@media(max-width:900px){
  .cu-wrap{grid-template-columns:1fr;gap:2rem;padding-top:5.5rem}
  .cu-panel{order:1}.cu-aside{order:2}
}
@media(max-width:560px){
  .cu-wrap{padding:5.2rem 1rem 3rem}
  .cu-card-main{padding:1.6rem 1.25rem 1.4rem;border-radius:26px}
  .cu-card-main::before{left:1.25rem}
  .cu-row{grid-template-columns:1fr}
  .cu-card-main h2{font-size:1.8rem}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
