/*
  Rethink of Design - Custom Stylesheet
  Version 2.1 - Form Fields Fixed
*/

:root {
    --cream: #F5F5F3;
    --charcoal: #3D4043;
    --olive: #707050; /* A muted, sophisticated green */
    --border-color: #D1D5DB; /* Lighter gray for borders */
    --white: #FFFFFF;
}

body {
    font-family: 'Jost', sans-serif;
    background-color: var(--cream);
    color: var(--charcoal);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.font-heading { font-family: 'Marcellus', serif; }
.font-body { font-family: 'Jost', sans-serif; }
.bg-cream { background-color: var(--cream); }
.bg-charcoal { background-color: var(--charcoal); }
.text-charcoal { color: var(--charcoal); }
.text-olive { color: var(--olive); }
.border-olive { border-color: var(--olive); }

/* --- General Components & Effects --- */
.fade-in {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in.visible {
    opacity: 1;
    transform: translateY(0);
}

/* --- Navigation --- */
.rtd-nav-link {
    font-weight: 500;
    font-size: 0.875rem; /* 14px */
    letter-spacing: 0.05em; /* tracking-wider */
    text-transform: uppercase;
    position: relative;
    padding-bottom: 0.25rem; /* py-1 */
    transition: color 0.3s ease;
}
.rtd-nav-link:hover {
    color: var(--charcoal);
}
.rtd-nav-link.active {
    color: var(--charcoal);
}
.rtd-nav-link::after {
    content: '';
    position: absolute;
    bottom: -2px; /* Position it slightly below the text */
    left: 0;
    width: 0%;
    height: 1px;
    background-color: var(--charcoal);
    transition: width 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.rtd-nav-link:hover::after, .rtd-nav-link.active::after {
    width: 100%;
}

/* --- Buttons --- */
.rtd-btn, .rtd-btn-secondary, .rtd-btn-light {
    display: inline-block;
    font-weight: 700;
    letter-spacing: 0.05em; /* tracking-wider */
    text-transform: uppercase;
    font-size: 0.875rem; /* text-sm */
    padding: 1rem 2.5rem; /* py-4 px-10 */
    transition: all 0.3s ease;
}

.rtd-btn {
    background-color: var(--charcoal);
    color: var(--white);
}
.rtd-btn:hover {
    background-color: var(--olive);
    box-shadow: 0 10px 20px -5px rgba(0,0,0,0.2);
    transform: translateY(-2px);
}

.rtd-btn-secondary {
    background-color: transparent;
    color: var(--charcoal);
    border: 1px solid var(--charcoal);
}
.rtd-btn-secondary:hover {
    background-color: var(--charcoal);
    color: white;
}

.rtd-btn-light {
    background-color: var(--cream);
    color: var(--charcoal);
}
.rtd-btn-light:hover {
    background-color: white;
    box-shadow: 0 10px 20px -5px rgba(0,0,0,0.1);
    transform: translateY(-2px);
}

/* --- Service & Process Cards --- */
.service-card, .process-step {
    border-left: 2px solid var(--olive);
    padding-left: 1.5rem;
}
.process-step-number {
    font-family: 'Marcellus', serif;
    font-size: 1.5rem;
    color: #ccc;
    margin-bottom: 0.5rem;
}


/* --- Project & Portfolio Cards --- */
.project-card-img, .portfolio-item img {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 0.5rem; /* rounded-lg */
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* shadow-lg */
    transition: all 0.5s ease-in-out;
}
.group:hover .project-card-img, .portfolio-item:hover img {
    transform: scale(1.03);
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}
.project-card-info {
    margin-top: 1.5rem; /* mt-6 */
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    color: var(--charcoal);
}
.project-card-arrow {
    font-size: 2.25rem; /* text-4xl */
    transition: transform 0.3s ease;
}
.group:hover .project-card-arrow {
    transform: translateX(10px);
}

/* --- Testimonial Card --- */
.testimonial-card {
    background-color: var(--cream);
    padding: 2rem; /* p-8 */
    border-left: 4px solid var(--olive);
}

/* --- Form --- (FIXED STYLES) */
.rtd-label {
    display: block;
    font-weight: 500;
    font-size: 0.875rem; /* 14px */
    color: #6b7280; /* text-gray-500 */
    margin-bottom: 0.5rem; /* mb-2 */
}
.rtd-input {
    width: 100%;
    background-color: var(--white); /* White background for contrast */
    padding: 0.75rem; /* p-3 */
    border: 1px solid var(--border-color); /* Visible border */
    border-radius: 0.25rem; /* rounded-sm */
    transition: all 0.3s ease;
}
.rtd-input:focus {
    outline: none;
    border-color: var(--olive);
    box-shadow: 0 0 0 3px rgba(112, 112, 80, 0.2); /* ring-2-like effect */
}
select.rtd-input {
    appearance: none;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 0.75rem center;
    background-repeat: no-repeat;
    background-size: 1.5em 1.5em;
    padding-right: 2.5rem;
}

/* --- Prose for Privacy --- */
.prose h3 {
    font-family: 'Marcellus', serif;
    font-size: 1.5rem; /* text-2xl */
    color: var(--charcoal);
    margin-top: 2rem; /* mt-8 */
    margin-bottom: 1rem; /* mb-4 */
}
.prose p, .prose ul, .prose ol {
    color: #4b5563; /* text-gray-600 */
    line-height: 1.75; /* leading-relaxed */
}
.prose ul {
    list-style-type: disc;
    padding-left: 1.5rem; /* list-inside like behavior */
}
