.tnds-body { background:#fff; }
.tnds-page{font-family: system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; color:#0f172a; background:#fff}
.tnds-container{max-width:1100px;margin:0 auto;padding:0 16px}
.tnds-title{font-size:30px; font-weight:800; margin:0 0 18px}
.tnds-section{padding:42px 0}
.tnds-section--soft{background:#f4f7fb}

.tnds-body {
    margin-bottom: 0;
}
/* hero */
.tnds-hero{
    min-height:360px;
    background-image:
            linear-gradient(90deg, rgba(10,28,43,.75), rgba(10,28,43,.25)),
            url('https://images.unsplash.com/photo-1502877338535-766e1452684a?auto=format&fit=crop&w=1800&q=70');
    background-size:cover; background-position:center;
}
.tnds-hero__inner{padding:120px 16px}
.tnds-hero__content{max-width:520px; color:#fff}
.tnds-hero__content h1{font-size:38px; line-height:1.15; margin:0 0 12px; font-weight:800}
.tnds-hero__content p{margin:0 0 18px; opacity:.95}

/* button */
/* button */
.tnds-btn{
    display:inline-flex; align-items:center; justify-content:center;
    background:#0e8aa6; color:#fff; border-radius:8px;
    padding:10px 18px; text-decoration:none; font-weight:700; border:0; cursor:pointer
}
.tnds-btn:hover{filter:brightness(.95)}
.tnds-btn--full{width:100%; padding:20px 18px; border-radius:10px}

/* detail */
.tnds-detail-grid{display:grid; grid-template-columns: 1.2fr .8fr; gap:28px; align-items:start}
.tnds-detail__block{background:#fff; border:1px solid #e6eef6; border-radius:12px; padding:16px; margin-bottom:14px}
.tnds-detail__block h3{margin:0 0 10px; font-size:16px; font-weight:800}
.tnds-list{margin:0; padding-left:18px; color:#334155}
.tnds-detail__block p{margin:0; color:#334155}
.tnds-car-img{
    height:400px;
    background:#fff;
    background-image:url('car-sedan.png');
    background-size:cover; background-position:center;
    width: 45vw;
    right: 50px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.tnds-section {
    position: relative;
}

/* cards */
.tnds-card{background:#fff; border:1px solid #e6eef6; border-radius:12px; overflow:hidden; margin-bottom:16px}
.tnds-card__head{
    background:#0e8aa6; color:#fff; font-weight:800;
    padding:14px 16px; font-size:15px
}
.tnds-card__body{padding:16px}

/* uploads */
.tnds-upload-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px; margin-bottom:14px}
.tnds-upload{border:1px dashed #cfe1ef; border-radius:12px; padding:14px; background:#fbfdff}
.tnds-upload__title{font-weight:700; margin-bottom:10px}
.tnds-upload__title span{font-weight:600; color:#64748b}
.tnds-upload__drop{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.tnds-upload__hint{color:#64748b}
.tnds-upload__btn{
    display:inline-flex; align-items:center; justify-content:center;
    background:#a855f7; color:#fff; border-radius:7px;
    padding:7px 12px; font-weight:800; cursor:pointer; user-select:none
}
.tnds-upload__file{color:#0f172a; font-weight:600}

/* fields */
.tnds-grid-2{display:grid; grid-template-columns: 1fr 1fr; gap:12px}
.tnds-grid-3{display:grid; grid-template-columns: 1fr 1fr 1fr; gap:12px}
.tnds-field label{display:block; font-weight:700; margin-bottom:6px}
.tnds-field .req{color:#ef4444}
.tnds-field input, .tnds-field select{
    width:100%; height:40px; border:1px solid #dbe7f2; border-radius:10px;
    padding:0 12px; outline:none; background:#fff
}
.tnds-field input:focus, .tnds-field select:focus{border-color:#0e8aa6; box-shadow:0 0 0 3px rgba(14,138,166,.12)}
.tnds-radio-row{display:flex; gap:14px; flex-wrap:wrap}
.tnds-radio{display:inline-flex; gap:8px; align-items:center; color:#334155; font-weight:700}

/* summary */
.tnds-summary-row{display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; margin-top:14px}
.tnds-summary{border:1px solid #e6eef6; border-radius:12px; padding:12px; background:#fff}
.tnds-summary__label{color:#64748b; font-weight:800; font-size:12px}
.tnds-summary__val{font-weight:700; margin-top:6px}

/* actions */
.tnds-form-actions{margin-top:10px}
.tnds-form-msg{margin-top:10px; font-weight:800}

/* footer */
.tnds-footer{background:#0b2435; color:#e2e8f0; padding:24px 0}
.tnds-footer__cols{display:flex; gap:20px; justify-content:space-between; flex-wrap:wrap}
.tnds-footer__brand{font-weight:900}
.tnds-footer__title{font-weight:900; margin-bottom:6px}
.tnds-footer__muted{color:#cbd5e1}

@media (max-width: 1200px) {
    .tnds-car-img {
        background-size: contain;
        background-repeat: no-repeat;
    }
}

/* responsive */
@media (max-width: 900px){
    .tnds-detail-grid{grid-template-columns:1fr}
    .tnds-upload-grid{grid-template-columns:1fr}
    .tnds-grid-2,.tnds-grid-3{grid-template-columns:1fr}
    .tnds-summary-row{grid-template-columns:1fr}
    .tnds-hero__content h1{font-size:30px}
    .tnds-car-img {
        display: none;
    }
}

.tnds-radio-row .tnds-radio {
    width: 100%;
    display: flex;
}

.tnds-radio input {
    width: 30px;
    height: 30px;
}
.logo svg {
    max-width: 100%;
    height: auto;
}

/* Modal */
.tnds-modal{
    position:fixed;
    inset:0;
    z-index:9999;
    display:none;
}

.tnds-modal.active{
    display:block;
}

.tnds-modal__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,0.6);
}

.tnds-modal__box{
    position:relative;
    max-width:420px;
    margin:15vh auto;
    background:#fff;
    border-radius:16px;
    padding:30px 26px;
    text-align:center;
    animation:tndsPop .35s ease;
    box-shadow:0 20px 50px rgba(0,0,0,.25);
}

.tnds-modal__icon{
    width:64px;
    height:64px;
    background:#0e8aa6;
    color:#fff;
    font-size:34px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    margin:0 auto 16px;
}

.tnds-modal__box h3{
    font-size:22px;
    font-weight:800;
    margin-bottom:12px;
    color:#0f172a;
}

.tnds-modal__box p{
    font-size:15px;
    line-height:1.6;
    color:#475569;
    margin-bottom:20px;
}

@keyframes tndsPop{
    from{
        opacity:0;
        transform:translateY(20px) scale(.95);
    }
    to{
        opacity:1;
        transform:translateY(0) scale(1);
    }
}

/* ===== Consent Modal (PDPL) ===== */
body.tnds-locked{
    overflow:hidden;
}

.tnds-consent{
    position:fixed;
    inset:0;
    z-index:10000;
    display:none;
}

.tnds-consent.active{
    display:block;
}

.tnds-consent__overlay{
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.55);
}

.tnds-consent__box{
    position:relative;
    width:min(980px, calc(100% - 32px));
    margin:14vh auto;
    background:#fff;
    border-radius:10px;
    border:1px solid #e5e7eb;
    box-shadow:0 24px 60px rgba(0,0,0,.25);
    overflow:hidden;
}

.tnds-consent__head{
    padding:18px 22px 6px;
}

.tnds-consent__title{
    font-weight:700;
    color:#0f172a;
    font-size:18px;
}

.tnds-consent__body{
    padding:0 22px 18px;
    border-top:1px solid #e5e7eb;
}

.tnds-consent__body p{
    margin:14px 0 14px;
    color:#0f172a;
    line-height:1.7;
}

.tnds-consent__check{
    display:flex;
    gap:12px;
    align-items:flex-start;
    padding:10px 0 6px;
    user-select:none;
}

.tnds-consent__check input{
    margin-top:4px;
    width:18px;
    height:18px;
    accent-color:#0e8aa6;
}

.tnds-consent__check span{
    color:#0f172a;
    line-height:1.6;
}

.tnds-consent__check a{
    color:#0e8aa6;
    font-weight:700;
    text-decoration:none;
}

.tnds-consent__check a:hover{
    text-decoration:underline;
}

.tnds-consent__footer{
    padding:14px 22px 18px;
    border-top:1px solid #e5e7eb;
    display:flex;
    justify-content:flex-end;
}

.tnds-consent__btn{
    background:#0e8aa6;
    color:#fff;
    border:0;
    border-radius:8px;
    padding:10px 18px;
    font-weight:800;
    cursor:pointer;
}

.tnds-consent__btn:disabled{
    background:#e5e7eb;
    color:#94a3b8;
    cursor:not-allowed;
}

html {
    scroll-behavior: smooth;
}