
/* /ethos_contact_us_form/static/OA-form-customer/assets/css/style.css */
 :root{--oa-ivory:#F6F6EE; --oa-orange:#F8501D; --oa-black:#000000; --oa-white:#ffffff; --oa-soft-grey:#E6E6DF; --oa-warm-line:#D2CDBE; --oa-shadow:0 18px 40px rgba(0,0,0,.06); --font-hero:"Anton",system-ui,-apple-system,BlinkMacSystemFont,sans-serif; --font-body:"Rubik",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0; font-family:var(--font-body); background-color:var(--oa-ivory); color:var(--oa-black); line-height:1.6;}a{color:inherit;text-decoration:none}.header{position:sticky; top:0; z-index:20; backdrop-filter:blur(12px); background-color:rgba(246,246,238,60%); border-bottom:1px solid rgba(210,205,190,.7);}.header-inner{max-width:1120px; margin:0 auto; padding:.75rem 1.5rem; display:flex; align-items:center; justify-content:center; gap:1.5rem;}.brand-lockup{display:flex; align-items:center; gap:1.5rem; flex-wrap:wrap;}.brand-clickday{display:flex; align-items:baseline; gap:.35rem;}.brand-clickday span:first-child{font-size:.65rem; text-transform:uppercase; letter-spacing:.35em; color:var(--oa-orange);}.brand-clickday span:last-child{font-family:var(--font-hero); font-size:1.25rem; letter-spacing:.08em;}.brand-separator{font-size:.75rem;color:#6b6b6b}.brand-oa{font-size:.75rem; letter-spacing:.18em; text-transform:uppercase;}.header-actions{display:flex; align-items:center; gap:.75rem; flex-wrap:wrap; justify-content:flex-end; font-size:.8rem;}.btn{border-radius:999px; padding:.6rem 5rem; font-size:.85rem; border:1px solid transparent; cursor:pointer; background-color:transparent; font-family:var(--font-body); display:inline-flex; align-items:center; justify-content:center; gap:.4rem; transition:all .18s ease-out; text-decoration:none; white-space:nowrap;}.btn-primary{background-color:var(--oa-orange); color:var(--oa-white); border-color:var(--oa-orange); box-shadow:0 10px 25px rgba(248,80,29,.25);}.btn-primary:hover:not(:disabled){filter:brightness(1.05); transform:translateY(-1px); box-shadow:0 14px 32px rgba(248,80,29,.32);}.btn-primary:disabled{opacity:1; cursor:not-allowed; box-shadow:none; background-color:#cccccc; border-color:#cccccc; color:#666666; transform:none;}.btn-secondary{background-color:var(--oa-ivory); color:var(--oa-black); border-color:var(--oa-warm-line);}.btn-secondary:hover{background-color:var(--oa-soft-grey); transform:translateY(-1px);}.btn-ghost{background-color:transparent; color:#555; border-color:var(--oa-warm-line);}.btn-ghost:hover{background-color:rgba(230,230,223,.75); transform:translateY(-1px);}.page-container{max-width:1120px; margin:0 auto; padding:0 1.5rem 4rem;}section{padding:4.5rem 0; scroll-margin-top:72px;}.section-border-top{border-top:1px solid rgba(210,205,190,.7);}.section-header{max-width:640px}.section-title{font-family:var(--font-hero); font-size:1.5rem; letter-spacing:.02em; margin:0; line-height:1.2;}.section-description{margin-top:.75rem; font-size:.95rem; color:#555;}.hero-subtitle{font-size:.8rem; text-transform:uppercase; letter-spacing:.3em; color:#777;}.form-card{margin-top:2.5rem; border-radius:24px; border:1px solid rgba(210,205,190,.9); background-color:var(--oa-white); box-shadow:var(--oa-shadow); padding:1.8rem 1.6rem 2rem; position:relative; overflow:hidden;}.form-card::before{content:""; position:absolute; top:-60px; right:-60px; width:160px; height:160px; border-radius:999px; border:1px solid rgba(210,205,190,.8); opacity:.5;}.form-steps{display:flex; gap:.75rem; flex-wrap:wrap; font-size:.78rem; font-weight: 700; text-transform:uppercase; letter-spacing:.22em; color:#aaa; margin-bottom:1.4rem; padding-top:1.4rem; position:relative; z-index:1;}.form-step{padding-bottom:.25rem; border-bottom:1px solid transparent; cursor:default;}.form-step--active{color:var(--oa-orange); border-bottom-color:var(--oa-orange);}.form-grid{display:grid; gap:1rem; position:relative; z-index:1;}.form-grid-2{grid-template-columns:repeat(2,minmax(0,1fr));}.form-field{display:flex; flex-direction:column; gap:.25rem; font-size:.85rem;}.form-label{font-weight:500; font-size:.8rem;}.form-input, .form-select{border-radius:10px; border:1px solid var(--oa-warm-line); padding:.6rem .7rem; font-family:var(--font-body); font-size:.85rem; background-color:rgba(255,255,255,.9); outline:none; transition:border-color .15s ease-out, box-shadow .15s ease-out, transform .1s ease-out; width:100%;}.form-input:focus, .form-select:focus{border-color:var(--oa-orange); box-shadow:0 0 0 1px rgba(248,80,29,.18); transform:translateY(-1px);}.form-select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23333' d='M1 1l5 5 5-5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 1rem center; background-size:12px 8px; padding-right:2.5rem;}.form-select:hover{border-color:var(--oa-orange)}.form-select:invalid{color:#757575}.form-note{margin-top:.75rem; font-size:.78rem; color:#777; position:relative; z-index:1;}.form-actions{margin-top:1rem; gap:.6rem; z-index:1; text-align: center;}.checkbox-group{display:flex;flex-direction:column;gap:1rem}.checkbox-item{display:flex;align-items:flex-start;gap:.75rem}.form-checkbox{appearance:none; width:18px;height:18px; min-width:18px;min-height:18px; border:2px solid #ddd; border-radius:5px; cursor:pointer; background-color:#fff; transition:all .2s ease; position:relative; flex-shrink:0; margin-top:2px;}.form-checkbox:checked{background-color:var(--oa-orange);border-color:var(--oa-orange)}.form-checkbox:checked::after{content:'\f00c'; font-family:"Font Awesome 6 Free"; font-weight:900; position:absolute; top:50%;left:50%; transform:translate(-50%,-50%); color:#fff; font-size:11px; line-height:1;}.form-checkbox:focus{outline:2px solid var(--oa-orange);outline-offset:2px}.form-checkbox:disabled{background-color:#f5f5f5;border-color:#ddd;cursor:not-allowed}.checkbox-label{font-size:14px; font-weight:400; color:#777; cursor:pointer; line-height:1.6; letter-spacing:0; user-select:none;}.checkbox-item:has(.form-checkbox:checked) .checkbox-label{color:var(--oa-orange)}.form-alert{position:fixed; bottom:20px; left:50%; transform:translateX(-50%) translateY(150px); max-width:650px; width:calc(100% - 40px); z-index:999; margin:0; padding:1rem 1rem; border-radius:12px; font-size:.85rem; line-height:1.5; border:1px solid transparent; display:grid; grid-template-columns:auto 1fr auto; column-gap:0.75rem; align-items:start; box-shadow:0 10px 40px rgba(0,0,0,.15); transition:transform .3s ease-out;}.form-alert.is-visible{display:grid; transform:translateX(-50%) translateY(0);}#alertMessage{min-width:0;}#alertMessage{align-self:start;}.form-alert #alertMessage ul{margin:0; padding:0 0 0 18px;}.form-alert #alertMessage li{margin:2px 0;}.form-alert--error{background-color:#ffecec; border-color:#f08a8a; color:#9b1b1b;}.form-alert--error::before{content:'\f06a'; font-family:"Font Awesome 6 Free"; font-weight:900; font-size:1.1rem; flex-shrink:0; line-height:1; align-self:start;}.alert-close{background:none; border:none; color:inherit; font-size:1.5rem; cursor:pointer; padding:0; flex-shrink:0; line-height:1; transition:opacity .2s; justify-self:end; align-self:start;}.alert-close:hover{opacity:0.7;}@keyframes slideDown{from{opacity:0; transform:translateY(-10px);}to{opacity:1; transform:translateY(0);}}.form-input.is-invalid, .form-select.is-invalid{border-color:#f08a8a !important; background-color:#fff9f9;}.invalid-feedback{display:block; color:#9b1b1b; font-size:.75rem; margin-top:.25rem; font-weight:500;}.success-modal{display:none; position:fixed; top:0;left:0;right:0;bottom:0; background-color:rgba(0,0,0,.5); z-index:1000; justify-content:center; align-items:center; padding:1.5rem; animation:fadeIn .3s ease-out;}.success-modal.is-visible, .success-modal.show{display:flex;}.success-modal-content{background-color:var(--oa-white); border-radius:24px; padding:3rem 2.5rem; max-width:500px; width:100%; text-align:center; box-shadow:0 25px 50px rgba(0,0,0,.15); animation:scaleIn .4s cubic-bezier(.34,.66,.66,1);}.success-icon{width:80px; height:80px; background-color:var(--oa-orange); border-radius:50%; display:flex; align-items:center; justify-content:center; margin:0 auto 1.5rem; font-size:2.5rem; color:var(--oa-white); animation:popIn .5s cubic-bezier(.34,.66,.66,1);}.success-modal-title{font-family:var(--font-hero); font-size:1.8rem; margin:0 0 0.75rem; color:var(--oa-black);}.success-modal-message{font-size:.95rem; color:#555; margin-bottom:2rem; line-height:1.6;}.success-modal-actions{display:flex; gap:1rem; justify-content:center; flex-wrap:wrap;}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes scaleIn{from{opacity:0; transform:scale(.9);}to{opacity:1; transform:scale(1);}}@keyframes popIn{0%{transform:scale(0);}50%{transform:scale(1.1);}100%{transform:scale(1);}}.footer{max-width:1120px; margin:0 auto; padding:0 1.5rem 1.25rem; font-size:.75rem; color:#999; border-top:1px solid rgba(210,205,190,.7);}@media (max-width: 900px){.header-inner{padding-inline:1rem}.page-container{padding-inline:1rem}}@media (max-width: 576px){.form-grid-2{grid-template-columns:1fr !important;gap:16px !important}.submit-btn, button[type="submit"]{width:100% !important;display:block}}.closing-footer{text-align: center; margin-top: 1rem;}